上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
Raphaël―JavaScript Library  こちらを使って、遊びつつ覚えつつ、メモしていきたいと思います。
 スクリプトがよく分かっていないので、よく分かりませんが…とりあえず動作したので、コレで良いと…?
        <div id="notepad"></div>

<script type="text/javascript"><!--

// Image dump
var set = Raphael(["notepad", 320, 200, {
    type: "rect",
    x: 10,
    y: 10,
    width: 25,
    height: 25,
    stroke: "#f00"
}, {
    type: "text",
    x: 30,
    y: 40,
    text: "Dump"
}]);

});
//--></script>


 パソコンの仕組みがさっぱり分からん…なんか、「ファイアバグ」でHTMLを見ると、innerHTMLで、SVGのタグを出力しているみたい…何故にSVGタグを出力しているだけなのに、Firefox3やIEでSVGが表示されるのか?
 IEだと、IE独自仕様のタグが生成されるのかな?
 しかし、Firefox3、ファイアバグで見れる、出力されていたSVGタグを、そのままコピペしてテストしても、勿論まともに表示されていないし…??

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="320" height="200"><desc>Created with Raphae"l</desc><defs/><rect x="10" y="10" width="25" height="25" r="0" rx="0" ry="0" fill="none" stroke="#ff0000"/><text x="30" y="43.5" text-anchor="middle" style="font: 10px "Arial";" font="10px "Arial"" stroke="none" fill="#000000"><tspan>Dump</tspan></text></svg>
↑ ファイアバグでHTMLを見ると、コレが出てきた…でも「Raphaël」のスクリプトを通すと、Firefox3できちんとSVGタグの通りに表示されてる…何故だ…??
 深く考えないで置こう…




        <div id="notepad2"></div>

<script type="text/javascript"><!--
var paper = Raphael("notepad2", 320, 200);
// regular rectangle
var c = paper.rect(10, 10, 50, 50);
// rectangle with rounded corners
var c = paper.rect(40, 40, 50, 50, 10);
//--></script>


 なるほど…やっと出来た…ここまでが分からないんですって、素人には。しかしここさえ分かれば…ちなみに「c =」の「c」って、なに?… cはどこにも代入されてないのに、何故図形が描けるんだ? ………あまり深く考えないで置こう…
このエントリーをはてなブックマークに追加
Fri.02.11.2011
Comment
Trackback
Comment Form
質問するときは?
  • 不具合が出ているページのURLを書き込む。
  • 使っているブラウザ(IE、Firefoxなど)を書き込む※IE6はサポート外です。
  • 次の人が確認できるように、使っているテンプレートの記事ページ、或いは各カスタマイズ記事ページにコメントを書きこむ。
コメント時の注意
やっぱり自分で解決したい時
特定の記事のみでレイアウトが崩れる場合
全ページでレイアウトが崩れる場合
メールフォーム
Bookmarks
Page Top
Copyright © SAKILab All Rights Reserved.
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。