Vue.jsアプリケーションでチャートをJSONにバインディング
JSONをデータソースとして利用し、構造化データをVue.jsのチャートコンポーネントに接続することで、データの変換を減らしAPI連携を簡素化
チャートのデータソースとしてJSON（JavaScript Object Notation）を使用することで、アプリケーションは構造化された軽量データを可視化コンポーネントに直接バインドできます。JSONはデータをオブジェクトや配列として表現するため、カテゴリ、系列（series）、個々のデータポイントを、現代のWeb開発の実務に自然に沿う形式で定義するのに適しています。RESTful APIやWebサービスでの広範な利用により、チャートはレンダリング前の複雑なデータ変換を減らしつつ、ライブまたはリモートのデータセットを効率的に取り込めます。
複数のVue.jsチャートコンポーネントでは、JSONをデータソースとして使用できます。たとえば：
- DevExtreme Vue Chart（DevExpressのDevExtreme Completeの一部）は、dataSource経由でJSONを受け入れます。これにより、系列（series）と引数（argument）のマッピングを用いて、ローカルまたはリモートのデータにバインドできます。
- Highcharts Core（Highsoft）は、JSONベースの配列と設定オブジェクトを使用して、系列（series）やカテゴリ（categories）を投入します。これは、直接行うことも、非同期ローディングを介して行うことも可能です。
- Kendo UI Vue Charts（TelerikのKendo UIの一部）は、オブジェクト配列にバインドし、通常はJSONから取得されます。さらに、プロパティマッピングによって系列（series）と軸（axes）に対応づけます。
- FusionCharts Suite XT はネイティブにJSONをサポートしており、完全なチャート設定とデータセットを定義して、チャートエンジンにそのまま渡せます。
機能と価格について詳しくは、Vue.jsチャートコンポーネントの比較をご覧ください。