キーを押して入力されたときに、キーコードを取得することは簡単です。今回は、既にアルファベットとして入力されている文字をキーコードに変換してみます。 キーコード表 キーコード表は、キーボードのキーに対応する数字をまとめた表です。以下の通りです…

今回はSVGオブジェクトの上に設定したテキストをいろいろな向きに反転する方法をまとめます。 ポイントは次の2点です。 text要素ではなくその上位のg要素で反転させる 反転に伴ってテキストが移動するので補正する 反転はテキスト要素ではなくg要素 SVGオブ…

この記事は Data Visualization Advent Calendar 2014 - Qiitaの9日目の記事です。 最近、心理学実験のデータをまとめていた研究者と一緒に可視化ツールを作成したので、それを紹介します。 概要 メタ分析とは何か？ InPhonDBプロジェクト 可視化ツールの特…

最近のラップトップPCは、非常に高い解像度のスクリーンのこともあります。今回は、高解像度のために多少手こずった話をまとめておきます。 指定したサイズにウインドウが生成されない 問題の発端はこれでした。Chrome拡張を利用したアプリを作成する際、man…

誰かに何かを主張したいとき、相手に納得してもらう手段はいろいろあります。最近のビックデータ解析の流行は、そんな説得の手段の一つになれるでしょうか。ビックデータ解析のようないわゆるエビデンスに基づく主張が社会に根付くかを考えていた時に気づい…

リピーターの方も初めての方も、このブログを閲覧いただきありがとうございます。このブログのアクセス数が10,000を越えました。きりのいいところで、このブログのあり方をまとめます。 アクセス数の変化について 昨年の12月の末からブログを始めました。お…

前回に引き続き、レスポンシブな環境で、改行タグを効果的に無効化する方法を考えます。前回提案した方法は、大まかに表示幅を設定しました。今回は、表示されているテキストの幅と表示可能領域の幅を厳密に比べます。表示可能領域が、テキスト幅より狭くな…

ウェブページの中には、テキストを中央寄せに配置しているものがあります。中央寄せは、タイトルや見出しに使われるようです。そして、中央寄せの文はしばしば訳の分からない位置で改行されます。例えば以下のような場合です。 左端から右端まで、長い長い1…

入力フォームを記入して、別のプログラムへ送信するときのボタンですが、formの中にあるか外にあるかで動作が異なります。若干はまったので、メモ代わりにまとめておきます*1。 formの中のbutton formの中にbuttonを設定するとクリックしたときに、submitさ…

今回は、多言語対応したウエブページで単語をどのように強調するかを考えます。個人のブログでは、多言語使用はほとんど問題にならなそうですが、多言語の文章をいかに等しく表現するかという問題として考えると面白いので、メモ代わりに書いてみます。 多言…

今回は、文中の特定の単語を強調する方法をまとめておきます。 文中の文字の強調 英語の文であれば引用符””で囲んだり、下線を引いたり、文字をイタリック（斜体）やボールド（太字）にしたりします。日本語の文でも、これらの形式で単語が強調されることが…

今回は、JavaScriptでテキストデータをファイルに書き出す方法とその際のクロスブラウザ対応*1を紹介します。 テキストデータをファイルに書き出す JavaScriptではFileAPIを利用してローカルファイルへアクセスできます*2。 今回は、File APIの中のBlobとい…

HTMLでは、セレクトボックスで、多肢選択の質問ができます。選択肢をセレクトボックスに設定するのは、簡単ですが、任意の項目を初期値にする際に、ちょっとはまったので、メモを残します。 セレクトボックスの設置 まずはHTMLでセレクトボックスを作ります…

JavaScriptをベースにブラウザでプレゼンテーションスライドを作るにはReveal.jsが便利です。今回は、スライドに背景画像を追加する方法を紹介します。 sectionに追加パラメータを設定する。 背景画像を追加したいsectionにdata-background="ファイル名"を追…

今回は、クロスブラウザ対応が必要な項目としてオブジェクト内の文字列の取得と設定をとりあげます。極めて基本的なオブジェクトにも関わらずクロスブラウザ対応が必要です。 (追記2014/10/15: その後調べた結果、クロスブラウザ対応の状況が変わっているこ…

今回は、クロスブラウザ対応（異なるブラウザで動作や表示をそろえること）に向けて、JavaScriptで使用中のブラウザを調べる方法をまとめておきます。 ブラウザごとにJavaScriptの動作や表示が違うのはなぜ？ ブラウザはそれぞれ異なるJavaScriptエンジンが…

以前、データの正規化にはいろいろな方法があることを述べました。 数量の正規化：方法の違いは何を意味するか？ - jnobuyukiのブログいろいろな正規化をやってくれるコマンドにR言語のscale（）があります。 この関数は、何も考えずに使ってもそれなりに動…

表計算ソフトで作成したグラフをpngやjpgなどの画像として保存して、プレゼンテーションに使いたいことがあります。MSエクセルで簡単にグラフを作成できますが、できたグラフは直接画像フォーマットのファイルで保存できません。Google スプレッドシートで作…

解析をテキストファイルで出力してから、MSエクセルに貼り付けてグラフにということがあります。これをGoogle Spread Sheetsで行う方法のメモです。 split(） split(分割したいセル, 区切り文字) これだけです。例えば a1に"1,2,3,4,5"という文字列が入って…

HTML5の標準で動くjavascript関数にshowModalDialog()というのがあります。この関数がChromeのバージョン37から使えなくなっているのですが、しばらくの間使い続ける方法を紹介します*1。 2014/09/19追記：showModalDialog()を有効にし続けることで、リスク…

たまに他の人が書いたコードを見ているとはまることがあります。今回の二重否定も、ネット検索して調べるのに意外と時間がかかったのでメモとして残します。 否定演算子！ 変数の値の判定などで論理演算子をよく使いますが、否定演算子の！は、真偽の値をひ…

Sublimte Textというテキストエディタがあります。有料（お試しは無料）ですが、高機能で大変便利です。よく使う機能はショートカットキーを覚えておくと、作業効率を高められます。 というわけで、この投稿は、追記を繰り返して、自分でよく使うショートカ…

前回、ビッグデータで何度も同じ統計的検定を繰り返す問題について考えました。今回は、一度にたくさんのサンプルを使って統計的検定を行うことによって生じる問題を取りあげます。 サンプルサイズが大きくなると 「ある母集団を想定して、そこから得たサン…

R言語は強力な統計ツールの開発がどんどん進んでいます。今回紹介するShinyはR言語をブラウザ上で使用するためのパッケージです。うまく利用すると、実験やシミュレーションの結果をわかりやすく伝えられそうな気がします。 Shinyのインストール CRANに登録…

今日は、昨今大変注目を集めているビッグデータについて思うところを述べてみます。というのは、こんな記事がFBの拡散で届いたからです。 http://googleenterprise-ja.blogspot.jp/2014/09/google-bigquery.html これのソース記事はこちらです。 Towards Psy…

今までにいくつかreveal.jsを利用したプレゼンテーションスライドの作成について投稿してきました。何回かreveal.jsを使ってプレゼンテーションを作成した結果、以下のようなことを感じています。 スライドの作成をテキストエディタだけでできるのは便利。 …

今回は、JavaScriptやHTML5を利用してウエブアプリケーションを作成する際にとても便利なエディタの紹介です。 Chrome Dev Editor Chrome Dev EditorはGoogleが開発したウエブアプリケーション作成用のテキストエディタです。通常のテキストエディタと同じよ…

今回は、Data Visualizationに関連した話です。ただ、私自身もまだ整理しきれていない考えです。この投稿はメモ代わりと言ってもいいかもしれません。 Data Visualization データビジュアリゼーション、つまりデータの視覚化です。表計算ソフトにずらっと並…

今回は、キーボードを押したときに時間を取得する方法を紹介します。 キーボード押しの判定 キーボードが押されたときに、何かイベントとなる関数を実行するにはdocumentのonkeydownというパラメータを利用します。 document.onkeydown = function(presskey)…

今回は、セレクトボックスの選択肢を任意の配列の情報から取得する方法を紹介します。このやり方を覚えておくと、データをインタラクティブに可視化する際に便利かもしれません。 HTML: セレクトボックスの設定 セレクトボックスにidをつけておくと後でd3.js…