タグ

SVGに関するbcoffeeのブックマーク (66)

  • JavaScriptで3D - os0x.blog

    id:wanparkさんが(3年前に)書かれたchannel3というFlash用3DグラフィックライブラリをJavaScriptにポーティングしてみました。IEは未対応です(たぶんそのうち)。 channel3JS - ss-o.net この前のCanvasでDot3Dが結構余裕だったので、もうちょっと格的な(だけどライブラリとして大きすぎないような)のをポートしたくなったところにchannel3のことを思い出して、突貫でやってみました(コメントアウトいっぱいでソースは綺麗じゃないです)。 SVGとCanvas両対応です。なぜかというとパフォーマンスを比べたかった(SVGのほうが良い)のと、テクスチャやるにはCanvasが必要になりそうだから。 実はSVGほぼ初めて触ったんですが、面白いので後でまとめようと思います。 ソースは os0x / channel3JS / source — B

    JavaScriptで3D - os0x.blog
  • スポーツアイテムのベクターデータセット「Vector sport」

    さまざまなシーンで活用することができる”ベクターデータ”。いくつあっても便利な素材として、webや紙媒体など、幅広いデザインシーンで重宝されていますが、今回はスポーツアイテムのベクターデータセット「Vector sport」を紹介したいと思います。 普段から頻繁に使用することは少ないかもしれませんが、スポーツをテーマとしたデザインをもし手がけることになった際には非常にありがたい素材ではないでしょうか? 詳しくは以下 ラグビー、野球、ボーリング、サッカー、ゴルフ、卓球などで使用する道具がモチーフになっており、比較的シンプルなデザインなので、さまざまなデザインに使用できるのではないかと思います。スポーツアイテムのベクターというものは今までにあまり見かけたことがなかったので、探していた方は是非活用したいところ。 今回紹介している素材は12種展開ですが、バスケットボールやバレーボールなど他にも種類

    スポーツアイテムのベクターデータセット「Vector sport」
  • 25 Free Creative World Map Templates for Designers – Speckyboy

    World map templates are crucial to many design projects. They provide the essential resources for visual storytelling, data representation, and highlighting international or geographical elements. This collection includes a wide range of free world map templates available across different platforms and design software. They come in various file formats, such as Illustrator (AI and EPS), Photoshop

    25 Free Creative World Map Templates for Designers – Speckyboy
  • SVGを使ったものすごいグラフライブラリ·dygraphs JavaScript Visualization Library MOONGIFT

    dygraphs JavaScript Visualization LibraryはJavaScript製のオープンソース・ソフトウェア。グラフライブラリは多数あれど、大抵は円グラフや棒グラフなどのシンプルなグラフを描く機能しかない。高度なグラフを描こうとすると利用できるライブラリは途端に少なくなる。 高機能なグラフライブラリ また高度なグラフはクライアントサイドだけでなく、サーバサイドの仕組みが必要になることも多い。そんな中dygraphs JavaScript Visualization Libraryはとても簡単に使えるグラフライブラリになっている。JavaScriptSVGを描いてグラフ化するのだ。 主なグラフはX-Y軸を持った折れ線グラフになるようだ。とはいえ測定範囲を含んだグラフを描いたり、グラフの一部をマウスを使って拡大する、マウスオーバーすると値が表示されるなど高度な機能

    SVGを使ったものすごいグラフライブラリ·dygraphs JavaScript Visualization Library MOONGIFT
  • Raphaël―JavaScript Library

    The most popular coding language for the web is javascript; so much so that since the advent of HTML5, it has now been officially accepted as the default standard. Javascript has moved beyond a smaller client-side browser-based language to become integrated not just for front-end design, but also for back-end server-side development. As a result there are has been a huge growth of Javascript libra

  • JavaScriptでSVGのレーダーチャートを描画するライブラリ Raphael Radar をつくった - I CAN ’CAUSE I THINK I CAN!

    概要 JavaScriptSVGを描画するライブラリRaphael.jsを使って、 操作可能なレーダーチャートを描画するライブラリ Raphael Radar を作りました。 Raphael Radar は次の2つの機能を持ちます。 レーダーチャートをSVGで表示 レーダーチャートの各軸の値をフォームと対応づけて、インタラクティブに値を選択 (2)の機能は任意で無効化して単純なレーダーチャートとして利用することもできます。 入手と使い方 依存ライブラリ Raphael Radar を使う前に、2つのライブラリをインストールする必要があります。 Raphael.js (1.3.1 以降) jQuery (1.4.2 以降) もしうまく動作しない場合、Raphael.jsとjQueryのバージョンを合わせてみてください。 インストール方法 上記の依存ライブラリをインストール Raphael