読者です 読者をやめる 読者になる 読者になる

jnobuyukiのブログ

JavaScriptとR言語を中心に研究活動に役立つwebアプリケーション技術について考えていきます。twitter ID: @j_nobuyuki

ウェブフォントの使い方(2):表示タイミングを制御する場合

ウェブフォントを利用すると個性的なテキスト表示ができますと前に書きました。 ウエブフォントの使い方 - jnobuyukiのブログいろいろ実験してみたところ、表示に関して、ブラウザのレンダリングでうまくいかないところがあったので、シェアします。 ウェブ…

SVG上のテキストの反転表示

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

ブラウザのHigh DPI対応

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

レスポンシブに改行タグを無効化 2

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

HTMLとCSSを利用した文中の文字の強調

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

JavaScriptでクロスブラウザ対応(2)

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

JavaScriptでクロスブラウザ対応(1)

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

Javascriptでブラウザの判別

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

ChromeでshowModalDialog()を使い続ける方法

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

Shinyを利用してインタラクティブにデータを解析

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

Chrome Dev Editorを使ってウエブアプリ開発

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

Googleドキュメントで変更履歴を残しながら文書を編集

昨日のニュースでGoogleが、Chromebookの日本販売を開始すると聞きました*1。ChromebookはChromeOSを利用しており、PCの中にソフトをインストールするというよりも、クラウド上のウエブアプリケーションをつかうという考え方で設計されています*2。こういう…

ブラウザからローカルファイルへのアクセス方法

問題:ブラウザからローカルファイルへのアクセス JavaScriptを使ってブラウザからローカルファイルにアクセスしたいとします。ブラウザによっては、これがすぐにできません。なぜなら、ローカルファイルへのアクセスがブラウザのセキュリティポリシーとして…