SVGとCanvasの特性の違いをチャートの実装を使って比較する - Qiita

はじめに チャートを使ったアプリを作りたいなと思っていて、自分が作りたいチャートを実装するにあたってSVGとCanvasのどちらがベターなのかを知るために、TypeScriptを使って、ほぼ同じロジックでローソク足のチャートを表示するツールを実装しました。 DEMO GitHub ツールについて Demoを見ていただければわかる通り、チャートの高さ、幅、表示データ数、スケール(Canvasのみで使用)が設定できるようになっています。 スケールとは、iPhoneのRetinaのような高精細ディスプレイの場合、Canvasをそのままで表示すると表示がぼやけてしまうため、devicePixelRatioで取得した値と同じだけCanvasを拡大させ、表示時に縮小させることでぼやけないようにするための設定です。100x100の場合、スケールが2だと200x200になるため4倍の広さになります。そのた

[idr_zz]

SVGとcanvasの比較。詳しい！それぞれの利点があるようだ。