タグ

javascriptとimageに関するtakahashitakashiのブックマーク (6)

  • vis.js·年表やオブジェクト同士のつながりを表現するグラフに MOONGIFT

    Web上でデータを表示するライブラリは実に多彩に存在します。それだけニーズはありつつもこれで決まり!というものがないのかも知れません。そのため、多様に存在するライブラリをチェックし、比較検討する必要があります。 vis.jsもそんなデータビジュアル化ライブラリの一つです。ネットワーク図をはじめ、データ同士のつながりを表現するのに向いたライブラリのようです。 vis.jsの使い方 さっそくサンプルを見ていきましょう。 年表のサンプルです。ズームイン、ズームアウトに対応しています。 HTMLを記載できます。 ネットワーク同士の繋がりを表現したグラフです。 ソーシャル。友だち同士のつながりと、その強さをビジュアル化しています。 オブジェクトの用例付き。 Graphvizからサンプルを拝借しています。データはマウスで動かせます。 垂直型のレイアウト。 グルーピングしたデータビジュアル化。 HTML

    vis.js·年表やオブジェクト同士のつながりを表現するグラフに MOONGIFT
  • いろんなところで役に立ちそうなPreloadJSをさわって使い方をまとめてみた

    * version 0.3.0を使用 * 何ができるか PreloadJSを使うと"ファイルの読み込みが終わってから何かする"という方法に一貫性を持たせることができるようになります。 利用シーンとしてはアニメーションの開始前に必要なファイルを確実に読み込ませたいとか色々考えられそうです。 使い方 画像の読み込みが完了してから処理を行う loadFile()の記述方法いろいろ loadManifestで複数ファイルを一括で登録する completeイベント itemのもつプロパティ ファイルの種類を判定して処理を行う 登録したアイテムをqueueから削除する 使い方 PreloadJSのサイトからダウンロードします。*執筆時点の最新は0.3.0* http://www.createjs.com/#!/PreloadJS APIドキュメント http://www.createjs.com/Do

  • PreloadJSの簡単な使い方

    こんにちは、橋です。 最近は毎日CreateJSと戯れる日々を過ごしております。 今回はそんなCreateJSファミリーの一つ、PreloadJSの使い方について書いてみたいと思います。 そうです。自分のための備忘録ですね。 そもそもPreloadJSとは何かといいますと、CreateJSファミリーの一つで、画像などの後読みを簡単に行うためのライブラリです。 必要なファイルを必要になったときに読み込むようにすることで、Webアプリの初期読み込みを早くすることができます。 とくにスマホ向けのWebアプリを作る際には、初期読み込みを如何に早くするかがポイントになってくるかと思いますので、そういったときに非常に有益なライブラリかと思います。 詳細は公式ページを御覧ください。 さて、前置きはこのへんにして、早速使い方を見て行きましょう。 当然の話ですが、PreloadJSを使うためには、Prel

    PreloadJSの簡単な使い方
  • 东北大炕上的一家人/榴莲飘飘/宿迁房屋出租/日本免费一卡二卡三卡四

    我们的梦想:做强做大,服务社会。 我们的追求:力争卓越、共赢共进。 我们的目标:打造精品,树立形象。 我们的传统:坚韧不拔,攻坚克难。 我们的精神:勤劳朴实,乐于奉献。

    东北大炕上的一家人/榴莲飘飘/宿迁房屋出租/日本免费一卡二卡三卡四
  • HTML5演出に最適な複数画像読み込み管理のJSライブラリ「LoadManager.js」 | ClockMaker Blog

    HTMLで複数の画像を読み込むとき、HTMLのimgタグだけだと不恰好となりがちですが、読み込みを管理すれば見栄えも整いますというデモとJSライブラリを作ってみました。次の2つのデモを見比べて何が違うのか確認ください。 デモ (通常のimgタグ) デモ (LoadManager.jsを使用) デモの違いとは 前者は画像がバラバラとインターレース的に読み込まれ、後者は読み込み終わるまでローディングが表示され読み込まれたものがフェードインして表示されます。 ▼前者のデモ ▼後者のデモ 後者のデモには、ローディングのパーセンテージ表示も付いています。読み込みが何%まで達しているかを確認できるのも、後述のJSライブラリのメリットです。 HTML5で作られたフルFlash的なサイトを見たときにimgタグでインターレース的に画像がバラバラとでてくることが多くて、いつも微妙な思いをしていました。Flas

    HTML5演出に最適な複数画像読み込み管理のJSライブラリ「LoadManager.js」 | ClockMaker Blog
    takahashitakashi
    takahashitakashi 2013/11/26
    読み込み制御。パーセンテージも取得できるってかなり良い。
  • JavaScript で画像本来のサイズ(幅, 高さ)を取得する - dogmap.jp

    画像や動画を lightbox 風に表示する拙作の jQuery 用プラグイン jQuery.lightpop.js ですが、画像の拡大表示で大きな問題がありました。 以下のようにサムネイル表示されている画像と、リンク先の画像が同一で、サムネイル表示している画像を width, height で小さく表示している場合、画像来のサイズ(幅, 高さ)が取得できないため、正常に表示できないのです。 <a href="pict01.jpg" rel="lightbox" title="画像1"><img src="pict01.jpg" alt="画像1" width="160" height="120"></a> 困ったなぁと思いつつも、画像来のサイズを取得する方法について調べずに放置していましたが、以下のエントリを読んで解決したので、久々に jQuery.lightpop.js をバージョ

    takahashitakashi
    takahashitakashi 2013/07/03
    こっちの方が短いか。渡すべき引数の型がイマイチピンと来ないんだが。
  • 1