SVGはScalable Vector GraphicsというXMLベースのドロー系画像フォーマットです。基本がXMLであるので、テキストエディタでHTMLのようにつらつら書けば画像が得られる形式です。もちろん、JAVAやCなどのテキストベースの標準出力で生成できるので、プログラムの処理結果をグラフで出力する事やいろいろな事が比較的簡単にできます。 さらに、SVGはJavaScriptと連動が可能であり、うまく作ればMacromedia Flashのような動的なページや、簡単なゲームなどが生成できます。テキストで書くだけでなく、Adobe Illustrator10など一部のAdobe製品で出力することができるので、XMLのコードを書きたくない人でも簡単に使えます。SVGは単なるXMLであるので画像を見るのは専用のビュアーが必要です。IEなどのブラウザで見る場合は、Adobe SV
1.イントロダクション 本連載第1回では、SVGグラフィックを動かすにはSMIL AnimationとDOMの2つの方法があり、SMIL Animationの書き方を簡単に解説しました。第3回では、DOM+JavaScriptでSVG表示を変更したり動かしたりする方法を紹介します。 Adobe社の「SVG Viewer」をIEにプラグインして使います。Adobe社のダウンロードサイトからダウンロードしてください。指定されたインストール手順に従うと、IEにプラグインされます。 2.スクリプトの書き方 SVGファイル中にスクリプトを書き込むには、以下の2つの方法があります。 ①<script>部分にスクリプトを書く <script>部分にスクリプト言語を書き込みます。 <script>要素の書き方 <svg width="100" height="100"> <script type="tex
CSS で position: absolute; にすると、画面上の絶対位置にオブジェクトを配置できるので、それを使って図形を描いてみるテスト。 実際に結果を見るにはこちら⇒猫(=・ω・=)顔 2.0β: test: JavaScript で図形描画をしてみる(circle篇) function plot(x, y, attr) { span = document.createElement("span"); span.innerHTML = attr.text; span.style.position = "absolute"; span.style.left = (x - attr.size / 2) + "px"; span.style.top = (y - attr.size / 2) + "px"; span.style.width = attr.size + "px"; sp
Drawing lines in Mozilla based browsers and the Internet Explorer - The Code Project - JavaScript JavaScriptで線を描画する方法についての記事。 JavaScriptで線を描画するためのGraphicsクラスライブラリも配布しているようです。 Graphicsクラスライブラリを使うと、次のような簡単なコードで線を描画できるようです。 var g = new Graphics(); g.drawLine(100,50,200,70); g.paint(); ダイナミックなインタフェースを実現するJavaScript ライブラリも多いですが、 こういったJavaScriptでの図形描画機能についてもおさえておきたいですね。 関連エントリ ブラウザ上で動作するJavaScript製のMSペイ
JavaScriptで線や円、四角形などの図形を描画するためのライブラリ「wz_jsgraphics.js」 2007年02月16日- DHTML: Draw Line, Ellipse, Oval, Circle, Polyline, Polygon, Triangle with JavaScript This JavaScript VectorGraphics library provides graphics capabilities for JavaScript: functions to draw circles, ellipses (ovals), oblique lines, polylines and polygons (for instance triangles, rectangles) dynamically into a webpage JavaScriptで線や円
canvas を使った JavaScript によるグラフ描画ライブラリ 2006-02-13-1: [JavaScript][Code] - new Javascript/Canvas Graph library http://aslakhellesoy.com/articles/2006/02/09/announcement-new-javascript-c ... HTML の canvas タグを使ったグラフ描画ライブラリ.アルゴリズムはスプリングモデル. canvas タグは Safari 2,Firefox 1.5,Opera 9 でサポートされている. 使い方は非常に簡単で,上記の画像は以下のソースで実現.本体は graph.js というファイル. <canvas id="people" width="350" height="350" style="border: 1px
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く