transitive.js - 路線図を生成するJavaScriptライブラリ MOONGIFT
データのビジュアル化を考えた場合、常に正確に出すのが最善とは限りません。トレンドを知りたい場合はその傾向を見るためにデータを無視したり、より特徴的なポイントに主眼を置いたりします。地図も同じです。 案内図などは正確性よりも直線や曲がり角を重視した図になっています。同様に路線図も駅の間隔や合流ポイントなどに主眼を置くでしょう。そんな分かりやすい路線図を生成できるのがtransitive.jsです。 transitive.jsの使い方 こちらがデモです。とても見やすい路線図ですね。 右側の路線をマウスオーバーすると、その路線だけがハイライト表示されます。 ズーム表示やマウスドラッグでの視点変更も可能です。 データを作るのが多少大変なように見えますが、一度作ってしまえば後はtransitive.jsが自動生成してくれるのが便利です。データ自体はデータベースに保存しておいてスクリプトで生成する形で
東京風速
About Control | «前日 – 1時間前 – 1時間後 – 翌日» – 最新 – 現在地 Overlay | None – Temp – Hum – WV – IN – NO – NO2 – NOX OX – SO2 – CO – CH4 – NMHC – SPM – PM2.5 Air Data | 東京都環境局環境改善部大気保全課 Map Data | 国土数値情報（行政区域データ）国土交通省 Author | Cameron Beccario @cambecc, Facebook, はてな Source | github.com/cambecc/air Modules | node.js, D3.js, when.js Inspiration | HINT.FM wind map 免責事項 | 正確な情報を提供するためのものではありません
[Fabric.js]SVGをcanvasに転写する
Fabric.jsは、canvasを操作するためのJavascriptライブラリです。 同様のライブラリは多数ありますがFabricの特徴は、内部にSVGパーサーを持ちsvgからcanvasへのインポートおよびcanvasからsvgへのエクスポートを行う機能があります。 //canvas要素の取得 var canvas = new fabric.Canvas('canvas'); canvas.setWidth(300); canvas.setHeight(300); //SVG要素取得 var SVGstring = document.getElementById('wrapSVG').innerHTML; //SVGをcanvasへ転写 fabric.loadSVGFromString(SVGstring , function(objects, options) { options.t
![[Fabric.js]SVGをcanvasに転写する](https://cdn-ak-scissors.b.st-hatena.com/image/square/7b610dbe2b49cf97138c9e2db34b09c179330f37/height=288;version=1;width=512/https%3A%2F%2Fgunmagisgeek.com%2Fblog%2Fwp-content%2Fuploads%2F2013%2F06%2Ffablic.jpg)
『スマートフォン向けJavaScriptライブラリ tofu.js』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 みなさんこんにちは！ 現在ブラウザベースの新規ゲームの立ち上げをしています、2013年入社のチャーリー@charlie10151015です！ 主にフロント側をメインにJavaScriptというへんてこな言語を書いています。 最近のマイブームは3D関連でthreejs, webGL, Blenderなどに手を伸ばしております。 tofu.jsについてお話できればと思います。 tofu.jsとは？tofu.jsはHTML5に組み込まれたcanvasをFlashライクなコードで利用できるJavaScriptのライブラリです。 弊社の主席エンジニアが開発し、
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
