HTML canvasタグ: グラフを描く
座標変換
グラフの座標変換サンプル
TestJS_canvas_draw_rect1.htmlcanvas, 四角形を描く。
TestJS_canvas_graph01.html
座標変換のクラスを用意して簡単なグラフを描いてみる。
ES2015 の class で記述。
JavaScript 次の一歩 (1)
TestJS_canvas_perspective01.html
一点透視図法の座標変換のサンプル。 3次元座標を一点透視図法で canvas 座標に変換し、 補助線と座標を描画する。
JavaScript マウスイベント処理
参考 : SVG
canvas ではなく svg でグラフを描くと、
svg 要素の viewBox 属性で座標変換できるので、
グラフ座標とスクリーン座標の変換の計算が不要になります。
SVG でグラフを描く