Articles Tagged: IgrDataChart

IgrDataChartのバブルシリーズでバブルごとに異なる内容のカスタムツールチップを表示したい場合は、IgrBubbleSeriesのtooltipTemplateプロパティを使用します。 IgrBubbleSeri […]

seriesMouseEnter / seriesMouseLeave イベントを利用することで、ホバーしたシリーズのデータを取得することが可能です。 チャートの設定 ホバーしたデータ要素を取得するには、IgrDataC […]

seriesMouseLeftButtonDown イベントを利用することで、クリックしたポイントのデータを取得することが可能です。 チャートの設定 クリックしたデータ要素を取得するには、IgrDataChart の s […]

通常、コールアウトレイヤー (IgrCalloutLayer) を使用すると、すべてのシリーズに対して同じ色やスタイルで表示されます。しかし、シリーズごとに異なる背景色やテキストカラーを設定したい場合があります。 本記事 […]

この記事の執筆時時点で Ignite UI for React にはガント チャートを作成するコンポーネントはないのですが、IgrDataChart の IgrStackedBarSeries を使用し、開始日までのフラ […]

IgrDataChartのデータポイントがグラフの端にある場合、マーカーが見切れてしまうことがあります。その場合はcomputedPlotAreaMarginModeプロパティを「Series」と設定すると、プロットエリ […]

IgrDataChart では、マウス位置にあるデータポイントに対応するツールチップを表示する機能が備わっています。この機能を有効にするには、シリーズの showDefaultTooltip プロパティに true を設 […]

IgrDataChartのY軸の数字の表示フォーマットをカスタマイズするには、formatLabelに書式化関数を指定してください。 たとえば、3桁ごとにカンマで区切る場合は、次のようになります。 　 実行結果 　 サン […]

IgrDataChartの棒グラフ（IgrColumnSeries）の棒の色を条件に応じて色分けする場合は、 IgrColumnSeriesのisCustomCategoryStyleAllowedをtrueにする。 I […]

IgrDataChartで棒グラフを作成したサンプルです。 プロンプトで、 npm install npm start で実行できます。 　 サンプル