2013-05-12から1日間の記事一覧
サクウェブTVはコチラ↓↓↓ さて、もう少し細工してみます。 前回はfor文を使用して線を一気に描画しましたが、これを一定時間ごとに1本ずつ描画することで少し、アニメーションのように見えるかもしれません。 やってみましょう。 利用するのはsetInterval…
サクウェブTVはコチラ↓↓↓ では、スクリプトをいじって描画を変えてます。 単純に線を増やしてみましょう。 描画処理を以下のように書きかえます。 for(var i=0;i<60;i++){ c.beginPath(); c.moveTo(10,10); c.lineTo(10+i*5,290); c.stroke(); } for文で線…
サクウェブTVはコチラ↓↓↓ さて、描画処理です。 前回のようにcanvas要素を描画オブジェクトとして取得したら、取得したオブジェクトに必要なメソッドを適用することで図形を描画できます。 今回は直線しか使用しませんが、円弧、ベジュ曲線など様々な描画…
サクウェブTVはコチラ↓↓↓ 開発開始 では開発を始めます。 assetsフォルダのwwwフォルダにjsフォルダを作成し、その中にscript.jsを作成してください。 次に、index.htmlを以下のように書きかえてください。 index.html <html> <head> <meta charset="utf-8"> <title>描画</title> <script type="text/javascript" src="jsWaffle.js"></script> </meta></head></html>
サクウェブTVはコチラ↓↓↓ こんにちは。 今回は、HTML5のcanvasの練習も兼ねて、簡単な描画を練習してみようと思います。 どうせなら前回までやっていたjsWaffleでAndroidアプリ化してみようかと思います。 開発環境の準備 jsWaffleのインストール jsWaffle…