MENU

ECharts — Baidu発でApacheに移管された多機能可視化

ECharts アイキャッチ
ECharts

Apache EChartsは2013年に中国の検索大手Baiduの開発チームが社内可視化基盤として開発を始めたJavaScriptライブラリです。2018年にApache Software Foundationへ寄贈され、2021年にトップレベルプロジェクトへ昇格しました。棒・線・円といった基本チャートに加え、地図、ヒートマップ、3D、サンキー、ツリーマップ、平行座標など数十種類のチャート型を標準装備し、設定オブジェクトを切り替えるだけで描画スタイルを変えられる柔軟さが特徴です。本記事ではEChartsのアーキテクチャと、Chart.jsやHighchartsとの違いを整理します。

目次

この記事の目次

  1. 多種チャートを統一する option 設定
  2. 豊富なチャート型と地図対応
  3. Baidu発 OSS のApache入り
  4. Chart.js やHighcharts との使い分け
  5. まとめ

多種チャートを統一する option 設定

多種チャートを統一する option 設定

EChartsはecharts.init(dom)でインスタンスを生成し、setOption(option)に巨大な設定オブジェクトを渡す形で描画します。title、tooltip、legend、xAxis、yAxis、series、dataZoom、visualMapなどのキーごとに振る舞いを宣言し、series配列のtypeを「bar」「line」「pie」「map」「scatter」「heatmap」「sankey」などに切り替えれば同じデータ構造のまま異なるチャートを描けます。複数のseriesを混在させた組み合わせチャートも自然に作れます。

v5以降はTypeScript型定義が公式化され、SVG/Canvasどちらでレンダリングするかも選べるようになりました。Canvasモードは大量データ向け、SVGモードは要素単位の操作や高DPI画面向けで、用途に応じて切り替えられます。ZRenderという独自レンダリングエンジンが内部で抽象層を担っており、両モードでAPIは共通です。

豊富なチャート型と地図対応

豊富なチャート型と地図対応

EChartsの真骨頂は標準装備のチャート種別の多さです。とりわけサンキーダイアグラム、平行座標、テーマリバー、コードダイアグラム、3D散布図といった専門的な図が「設定だけで」描ける点はChart.jsとの大きな差別化要素です。地理可視化にも力が入っており、中国・日本・世界のGeoJSONを読み込んで国別/省別/都道府県別の塗り分けやシンボルマッピング、移動経路の表示が可能です。echarts-gl拡張で3D地球儀やボクセル表現にも対応します。

VisualMapやDataZoomといった共通コンポーネントも強力で、色や大きさをデータ値に応じてマッピングしたり、時系列の範囲を双方向スライダーで絞り込んだりが宣言的に書けます。ダッシュボード製品やBIツールに組み込みやすく、AlibabaのDataV、ByteDanceのVeline、SapphireBIなど中国系の主要BI製品がEChartsをエンジンとして採用しています。

Baidu発 OSS のApache入り

Baidu発 OSS のApache入り

EChartsは2013年6月、Baiduの商用分析プロダクト向けに開発が始まり、同年OSSとしてGitHubに公開されました。中国国内ではBAT(Baidu/Alibaba/Tencent)3社がそれぞれ独自の可視化ライブラリを生んでおり、EChartsはBaiduの代表的なOSS資産として急速に普及しました。2018年1月にApache Software Foundationのインキュベータプロジェクトとして寄贈され、ガバナンスを国際化しました。

2021年1月、Apache EChartsはトップレベルプロジェクト(TLP)に昇格しました。中国発で初めての可視化系TLPであり、東アジア圏のOSSが国際的なガバナンスフレームに乗った象徴的な事例です。ライセンスはApache License 2.0で、特許条項込みのオープンライセンスです。コミッターにはBaidu出身者だけでなく、欧米のコントリビュータや日本企業のメンバーも参加するようになりました。

Chart.js やHighcharts との使い分け

Chart.js やHighcharts との使い分け

EChartsは「機能の多さで選ぶライブラリ」です。Chart.jsの軽量さやD3.jsの自由度とは別軸で、地理マップ、3D、複雑な統計図など「ちょっと珍しい図」を最短で実装したい場面に強みがあります。商用ライセンスを購入するHighchartsと比べても、Apache 2.0のOSSとして無償で同等の表現力が得られる点が魅力で、SaaS製品の組み込みエンジンとして採用される事例も増えています。

弱点は設定オブジェクトの巨大さです。option配下のキーが数百項目にわたるため、初学者は何を書けば目的のチャートになるか把握しづらく、公式ドキュメントとサンプルギャラリーを行き来する必要があります。TypeScript型定義は揃ったものの、Highchartsほどの型支援はまだ得られず、複雑なカスタマイズではJSDocやサンプルコードを参照しながら進めるのが現実的です。

まとめ

ECharts はBaidu発のJavaScript可視化ライブラリとして、Apache 2.0のオープン性と数十種類のチャート種別を両立した数少ない存在です。地図や3D、サンキーなど特殊な図を標準装備し、Chart.jsより表現力が高くHighchartsより無償で扱えるポジションが評価されています。設定が大きい点はトレードオフですが、BIや管理画面のエンジンとしての適性は依然高水準です。

※本記事はIT用語辞典の手書きドラフトです。公開前に最新情報・出典を確認のうえ加筆修正してください。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

コメント

コメントする

目次