
エントリーの編集

エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。

- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
Vue.jsでD3.jsを使わずにグラフを実装する - Qiita
Vue.jsでグラフ を実装するサンプルコードを探すとD3.jsを用いている例が結構見つかります。 しかし本当... Vue.jsでグラフ を実装するサンプルコードを探すとD3.jsを用いている例が結構見つかります。 しかし本当にD3.jsが必要なのでしょうか? この記事ではD3.jsやその他グラフライブラリを用いずにVue.jsのみで実装したグラフについて解説します。 TL;DR SVGでおk グラフコンポーネントにSVGのテンプレートを書く テンプレートに必要な値を computed でじゃんじゃん作る デモとリポジトリ デモ: https://haribote.github.io/vue-graph-demo/ リポジトリ: https://github.com/haribote/vue-graph-demo 折れ線グラフ、棒グラフ、円グラフ、の3つのグラフを実装してみました。 データの内容はプロ野球における直近5シーズンの年間入場者数です。 NPBが公開している統計データからJSONを用意しました
2017/12/05 リンク