« ココログでJavascriptを使う(グラフィックス canvas実験編) | トップページ | Javascriptで数値計算その1(ルンゲクッタ法でローレンツ方程式) »

2010年4月18日 (日)

ココログでJavascriptでCanvas機能(excanvas.js)を使う。

一応、さっきの動いたみたいなんで解説を。
http://sci.tea-nifty.com/blog/2010/04/javascript-canv.html
Canvasを使いたいのだが、Internet Explorerはサポートしていない。
そこでexcanvas.jsを使っている。
http://excanvas.sourceforge.net/
ソースはこんな感じで。最初に"excanvas.compiled.js"を使う
宣言をしていれば後はすこぶる簡単にグラフィックスが描ける。
しかしあんまり日本語の解説がないね。誰も使ってないんだろうか。
さてこれができるようになったらようやく本題の数値計算に入れる(続く)。


<!--[if IE]>
<script type="text/javascript" 
src="http://sci.tea-nifty.com/blog/files/excanvas.compiled.js">
</script><![endif]-->

<script>


function func100418() {
  var ctx = document.getElementById('c100418').getContext('2d');
  
  ctx.strokeStyle ="rgb(0,0,0)";
  ctx.strokeRect(0,0,300,300);

  ctx.strokeStyle ="rgb(255,0,0)";
  ctx.beginPath();   
  ctx.moveTo(0,150);  
  for (i=0;i<=300;i++) {
     ctx.lineTo(i,150-50*Math.sin(2.*Math.PI*i/300.));   
  }
  ctx.stroke();
}



</script>
<div><input type="button" value = "OK!" onclick ="func100418()"></div>
<canvas id="c100418" width="300" height="300"></canvas>

« ココログでJavascriptを使う(グラフィックス canvas実験編) | トップページ | Javascriptで数値計算その1(ルンゲクッタ法でローレンツ方程式) »

パソコン・インターネット」カテゴリの記事

学問・資格」カテゴリの記事

コメント

コメントを書く

(ウェブ上には掲載しません)

トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/512682/48119122

この記事へのトラックバック一覧です: ココログでJavascriptでCanvas機能(excanvas.js)を使う。:

« ココログでJavascriptを使う(グラフィックス canvas実験編) | トップページ | Javascriptで数値計算その1(ルンゲクッタ法でローレンツ方程式) »

最近の記事

2018年1月
  1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31      
フォト
無料ブログはココログ