Delphi、C++ Builder & .NET sgcUI の製品です

sgcCharts、Delphi、C++ Builder & .NET 向けチャート

ダッシュボード、分析画面、トレーディング画面に使える 1 つのチャートライブラリです。折れ線からウォーターフォールまで 17 種類の系列、SMA、RSI、MACD、ボリンジャーバンドの指標、ライブフィード、ズームと描画ツール、PNG または SVG の出力に対応します。LiveLine デモでは、リングバッファを通して 100 万点をストリーミングします。

VCL、FireMonkey、WinForms、WPF、Avalonia1 つのモデルで 17 種類の系列LiveLine デモ: リングバッファで 100 万点sgcUI Professional に含まれます
ボリンジャーバンド、移動平均、出来高、RSI、描画ツールを表示した sgcCharts のローソク足チャート

チャートライブラリに必要なすべてを

7 つのグループに分けた 17 の機能です。それぞれ実際のコンポーネントやプロパティ名を示し、ヘルプトピックにリンクしています。登録版と表示された機能は、無料の .NET Community ビルドには含まれません。

チャートの種類

1 つのモデルで 17 種類の系列を扱え、データに応じて必要な数の軸を使えます。

系列ギャラリーから描画した sgcCharts の面グラフ

チャートの種類

1 つのチャートモデルで 17 種類のチャート

営業画面には棒グラフとドーナツ、実験画面には散布図とヒートマップ、トレーディング画面にはローソク足が必要です。sgcCharts なら、これらすべてを 1 つのモデルでカバーできます。どの系列もフォームに配置するかコードで作成できるコンポーネントで、TsgcChart に関連付けて自由に組み合わせられます。API を一度覚えれば、すべての画面で再利用できます。

  • 折れ線、高速ライン、階段線、面、レンジエリア、棒、散布図、バブル、ローソク足、OHLC。数値、日時、対数、カテゴリの各軸に対応します
  • カテゴリデータ向けに、円とドーナツ、レーダー、ヒートマップ、ツリーマップ、ファネル、箱ひげ図、ウォーターフォールを用意しています
  • TsgcChartSeries_Bar は縦棒または横棒を、グループ化または積み上げ(Grouping)で描画します
  • 17 種類すべてが全エディションに含まれ、無料の .NET Community ビルドも対象です
  • アラビア語とヘブライ語の右から左対応:タイトル、凡例、ツールチップ、ツールバー、範囲セレクターがミラー化され、MirrorPlot はプロットと軸もミラー化します
ヘルプのトピックを読む
営業ファネルの隣に表示した sgcCharts のドリルダウン対応ツリーマップ

チャートの種類

ビジネスデータ向けのドーナツ、ツリーマップ、ファネル

経営報告では、構成比、階層、コンバージョンの段階が求められます。円系列はプロパティ 1 つでドーナツになり、小さなスライスの長い裾野を 1 つの「その他」にまとめるので、グラフが読みやすいままです。ツリーマップは値に応じて入れ子の長方形をサイズ付けし、クリックでドリルダウンします。ファネルは営業やサポートの各段階を割合とともに表示します。ラベルはスライスの内側にも外側にも置け、ツリーマップはグループ別または値に応じたカラースケールで色分けできます。どの系列もチャートのテーマに従うため、レポートがアプリケーションのほかの部分と揃います。

  • InnerRadiusPercent でドーナツにし、OthersThreshold と OthersText で小さなスライスをまとめます
  • ExplodeOnClick は、ユーザーがクリックしたスライスを切り出します
  • TsgcChartSeries_Treemap、DrillOnClick、DrillUp、OnDrill イベント
  • TsgcChartSeries_Funnel、NeckWidthPercent、ProportionalHeight
ヘルプのトピックを読む

チャートの種類

バブル、箱ひげ図、ウォーターフォール、レンジエリア

経理チームは予算から実績までの利益ブリッジを、品質エンジニアはシフトごとのサイクルタイムのばらつきを、プロダクトマネージャーは売上、利益率、人員を 1 つのチャートで見たいと考えます。4 つの系列がこれらに応えます。バブル系列は X と Y にサイズを加えます。箱ひげ図は、標本を四分位、中央値、外れ値で要約します。ウォーターフォールは、プラスとマイナスのステップから、途中の小計と合計を含めて合計を組み立てます。レンジエリアは、予測区間や許容範囲の帯など、下限と上限の間を塗りつぶします。

  • TsgcChartSeries_Bubble は AddBubble、MinBubbleSize、MaxBubbleSize、SizeMode を備え、面積(cbsArea)または直径(cbsDiameter)でサイズを決めます
  • TsgcChartSeries_BoxPlot は最小値、四分位、中央値、最大値、任意の平均値を描画します。AddValues は生の標本から Excel の QUARTILE.INC と同じ方法で四分位を計算し、Tukey の外れ値を求めます
  • TsgcChartSeries_Waterfall は AddStep、AddSubtotal、AddTotal、ShowConnectors を備えます
  • TsgcChartSeries_RangeArea は、下限と上限の帯を AddRange で指定します
  • 4 つとも全エディションに含まれ、無料の Community 版も対象です。VCL、FireMonkey、WinForms、WPF、Avalonia で使えます
ヘルプのトピックを読む

チャートの種類

スムーズな線と誤差バー

実験レポートでは各測定値を不確かさとともに示し、ダッシュボードの推移はギザギザよりも曲線のほうが読みやすくなります。折れ線、面、レンジエリアの系列で Smooth を設定すると、単調な 3 次スプラインで描画されます。曲線はデータを超えて行き過ぎないので、値にない山や谷が現れません。誤差バーは、折れ線、面、散布図、棒の系列に各ポイントの不確かさを加えます。固定値、パーセント、系列の標準偏差、ポイントごとの独自の値から指定できます。

  • TsgcChartSeries_Line、TsgcChartSeries_Area、TsgcChartSeries_RangeArea の Smooth
  • ErrorBars.Kind: cebFixed、cebPercent、cebStdDev、または AddCustom を使う cebCustom
  • Direction: cedBoth、cedPlus、cedMinus。端のキャップの幅は CapWidth で指定します
  • 値軸が自動的に広がるので、誤差バーが切れることはありません
  • 全エディションに含まれ、無料の Community 版も対象です。VCL、FireMonkey、WinForms、WPF、Avalonia で使えます
ヘルプのトピックを読む
3 本の別々の値軸にプロットした 3 つの系列

チャートの種類

1 つのチャートに複数の軸

気温と気圧、売上と数量、価格と出来高など、実際のデータが 1 つのスケールを共有することはまれです。必要な数だけ軸を追加し、左、右、上、下に配置して、各系列を専用の軸のペアにバインドできます。軸ごとに種類、範囲、ラベル形式を選べるので、日時の下軸を数値の左軸と対数の右軸の下に置くこともできます。各系列は使用する軸を指定するため、2 本の線が左軸を共有し、3 本目が右軸を使うこともできます。軸は独立してズームし、ResetZoom で全範囲に戻ります。

  • TsgcChart の Axes コレクション。スケールごとに TsgcChartAxis を 1 つ使います
  • AxisType: catNumeric、catLogarithmic、catDateTime、catCategory
  • Position: capLeft、capRight、capTop、capBottom
  • 軸ごとに Minimum、Maximum、Automatic、LabelFormat、Inverted を設定できます
ヘルプのトピックを読む

金融チャート

ローソク足は全エディションに含まれ、金融パック(指標、ペイン、マーカー、描画ツール)も利用できます。

日時軸上の sgcCharts ローソク足チャート

金融チャート

鮮明さを保つローソク足と OHLC チャート

価格履歴は、あらゆるトレーディング画面の中核です。ローソク足系列と OHLC 系列は、独自のデータまたはデータセットから、日時軸に始値、高値、安値、終値をプロットします。何年分ものバーが狭いウィンドウに収まる場合、同じピクセル列に入るローソク足は正確な 1 本に統合されるため(最初の始値、最高値、最安値、最後の終値、出来高の合計)、誤解を招くスパイクがチャートに現れることはありません。OHLC 系列は同じデータを、始値と終値のティック付きバーで描画します。長い履歴に向くコンパクトな表現です。どちらの系列も、すべてのチャートのズーム、パン、クロスヘアに対応します。

  • TsgcChartSeries_Candlestick と TsgcChartSeries_OHLC は 1 つの OHLC バッファを共有します
  • TsgcChartDataSource_DataSet は OpenField、HighField、LowField、CloseField、VolumeField をマップします
  • sgcChartDecimateOHLC によるローソク足のピクセル列統合
  • どちらの系列も全エディションに含まれ、無料の .NET Community ビルドも対象です
ヘルプのトピックを読む
計算式を書かずにテクニカル指標

金融チャート 登録版のみ

計算式を書かずにテクニカル指標

アナリストは、価格チャートに移動平均、ボリンジャーバンド、RSI、MACD があることを期待します。各指標は系列です。Source をローソク足系列に向けると、ローソク足が変わるたびに再計算されます。コードを書いたり、テストしたり、ライブデータと同期を保ったりする数式は不要です。RSI やストキャスティクスなどのオシレーターは買われすぎと売られすぎのガイドラインを描画し、すべての指標系列が固有の色で凡例に表示されます。価格ペインに重ねることも、指標ごとに専用のペインを与えることもできます。

  • トレンド: TsgcChartSeries_SMA、TsgcChartSeries_EMA、TsgcChartSeries_WMA、TsgcChartSeries_Bollinger
  • オシレーター: TsgcChartSeries_RSI、TsgcChartSeries_MACD、TsgcChartSeries_Stochastic、GuideLines 付き
  • ボラティリティと出来高: TsgcChartSeries_ATR、TsgcChartSeries_VWAP、TsgcChartSeries_Volume
  • Recalculate で必要なときに再計算し、Values で計算結果を読み取れます

.NET Community ビルドにはローソク足系列と OHLC 系列が含まれますが、指標系列は含まれません。

ヘルプのトピックを読む
ペイン、最終値マーカー、売り気配と買い気配のバンド

金融チャート 登録版のみ

ペイン、最終値マーカー、売り気配と買い気配のバンド

トレーディングのレイアウトでは、価格、出来高、オシレーターを 1 つの時間軸を共有する別々のペインに積み重ねるため、価格をズームすると下のペインもすべてズームされます。価格軸のマーカーが最新値を一目で示し、気配値がストリームされている間は、現在のスプレッドが網掛けのバンドで表示されます。ペインの高さは割合で指定するので、レイアウトはウィンドウに合わせて拡大縮小し、サイズ変更後も保たれます。各ペインには Visible プロパティもあり、ユーザーが求めたときだけ指標ペインを表示する画面も作れます。

  • TsgcChartPane の Panes コレクションと HeightPercent。ユーザーはペイン間のスプリッターをドラッグできます
  • 各軸は Pane プロパティでペインに割り当てます
  • LastValueMarker の Color と Visible
  • BidAskBand の Bid、Ask、BidColor、AskColor
ヘルプのトピックを読む

金融チャート 登録版のみ

アナリスト向けの描画ツール

トレーダーは、サポートライン、トレンドチャネル、リトレースメントをチャート上に直接書き込みます。ツールを選び、プロット上でドラッグすると、描画はデータ座標に固定されるため、ユーザーがズームやパンをしても正しいローソク足に留まります。描画はコレクションなので、コードから追加したり、編集をロックしたり、削除したりできます。線は実線、破線、点線を選べ、色と太さも指定できます。描画は座標を持つ通常のコレクションなので、ユーザーのワークスペースに保存し、次回の起動時に戻すことができます。

  • Interaction.DrawingTool: cdtTrendLine、cdtHorizontalLine、cdtVerticalLine、cdtRectangle、cdtFibonacci
  • Drawings コレクションの X1、Y1、X2、Y2、Color、Dash、Locked
  • DeleteSelectedDrawing は、ユーザーが選択した描画を削除します
  • DrawingTools デモで確認できます
ヘルプのトピックを読む

注釈と編集

データの意味をチャート上で説明し、ユーザーが実行時にチャートを調整できるようにします。

注釈と編集

注釈と ISA-101 の画面

オペレーター画面には、警報の上限を示す線、通常の運転範囲を示す帯、バッチを開始した時点のメモが必要です。注釈はデータ値で配置するので、ズームやパンをしても、新しい点が流れ込んでも、正しい位置に留まります。コールアウトは、固定のデータポイントを指すことも、ライブ系列の最新ポイントに追従することもできます。制御室向けに、ApplyISA101Theme はチャートを ISA-101 の HMI 画面で使われる、グレーで落ち着いたスタイルに切り替えます。色は異常な状態のために残されるので、優先度 1 から 4 の警報色が静かな画面で際立ちます。

  • TsgcChart の Annotations コレクション。項目ごとに 1 つの TsgcChartAnnotation を持ちます
  • Kind: cakText、cakLine、cakHorizontalLine、cakVerticalLine、cakRectangle、cakHorizontalBand、cakCallout
  • AnchorSeries と AnchorPoint でコールアウトをデータポイントに結び付けます。既定の AnchorPoint は -1 で、最新のポイントに追従します
  • 注釈はテーマと Windows のハイコントラストに従い、スクリーンリーダーがそのテキストを読み上げます
  • ApplyISA101Theme は優先度 1 から 4 の警報色を維持します

注釈と ISA-101 プリセットは全エディションに含まれ、無料の Community 版も対象です。VCL、FireMonkey、WinForms、WPF、Avalonia で使えます。プリセットについては次のトピックで説明しています: テーマとパレット

ヘルプのトピックを読む
チャートデザイナーのデータページ: チャートの種類、列または行からの系列、上位 N 件、円グラフの系列、データラベル、総計、各メジャーの複合系列

注釈と編集

ユーザーがチャートを編集

チャートをプレゼンテーションに載せる前に、ユーザーは売上の線を会社の色にし、軸タイトルをわかりやすくし、返品の系列を隠したいと考えます。実行時のチャートエディターがあれば、アプリケーションを作り直さなくても、ユーザー自身で行えます。1 回の呼び出しでダイアログが開き、タイトル、凡例、軸、各系列を編集できます。系列では、色、表示の切り替え、スムージング、互換性のある別の系列タイプへの変更ができます。

TsgcChartTableLink でテーブルにバインドしたチャートでは、チャートデザイナーが同じダイアログにデータページを加えます。チャートの種類 (集合縦棒、積み上げ縦棒、100% 積み上げ縦棒、折れ線、面、円、ドーナツ、複合)、列または行からの系列、上位 N 件、円グラフの系列、書式付きのデータラベル、ピボットの総計の行と列、複合チャートの各メジャーの系列の種類と軸を設定できます。これは sgcPivotGrid のピボットチャートのデザイナーで、リンクがプロットするどのテーブルでも使えます。 登録版のみ

  • VCL、FireMonkey、WinForms、WPF では ShowEditor
  • Avalonia では ShowEditorAsync
  • タイトル、凡例、軸を 1 つのダイアログで編集
  • 系列ごとに、色、表示、Smooth、互換性のある系列タイプ間の切り替え
  • Delphi の sgcVCLShowChartDesigner と sgcFMXShowChartDesigner、.NET の ShowDesigner と ShowDesignerAsync、Delphi IDE の Chart designer... verb

実行時のチャートエディターは全エディションに含まれ、無料の Community 版も対象です。チャートデザイナーと、テーブルリンクの 100% 積み上げ、円、ドーナツ、複合のタイプは Community 版に含まれません。棒、積み上げ棒、折れ線、面のテーブルリンクは含まれます。

ヘルプのトピックを読む チャートデザイナーのトピックを読む

ライブデータと探索

大規模なデータをストリーミングし、ユーザーが細部を確認できるようにします。

ライブデータと探索

100 万点でも途切れない

センサーログ、音声レベル、ティックデータは際限なく増えます。高速ライン系列は、固定の Capacity を持つリングバッファに点を保持するため、メモリ使用量は一定で、古い点から順に消えていきます。描画時には、各系列が表示する点をピクセル列ごとに 1 組程度に減らし、データがどれだけ速く届いても、チャートの再描画は 1 秒あたり最大 MaxFPS 回に抑えられます。LiveLine デモは、バックグラウンドスレッドから 100 万点のバッファにストリームします。実行中にフィードレートや表示ウィンドウを切り替えられるので、コードを 1 行書く前に、自分のハードウェアでの動作を確かめられます。

  • TsgcChartSeries_FastLine の Capacity と BufferMode(cbmOverwrite または cbmGrow)
  • Decimation: dmNone、dmMinMax(見た目に正確)、dmLTTB
  • TimeWindow は、ストリーミング軸の直近 N 秒だけを表示します
  • AddXY と AddY で、届いた点を追加します
ヘルプのトピックを読む

ライブデータと探索

ズーム、パン、クロスヘア、ツールチップを標準搭載

ユーザーは、データの気になる部分を拡大して見たがります。どのチャートも、ホイールズーム、マウスによる範囲ズーム、パン、タッチジェスチャーに対応しており、クロスヘアとツールチップは最も近い点に吸着します。ストリーミングチャートでは、ズームすると自動スクロールが一時停止し、指定した遅延の後に自動で再開します。すべてのオプションはプロパティなので、キオスク画面では操作をオフにし、アナリスト画面ではズームを時間軸だけに制限できます。同じ動作は VCL、FireMonkey、.NET の各ビューで機能します。

  • TsgcChartInteraction: WheelZoom、BoxZoom、Pan、ZoomMode(czmX、czmY、czmXY)
  • Crosshair、Tooltip、SnapToPoint
  • ライブチャート向けの AutoScrollResumeDelay と Paused
  • OnZoom、OnCrosshairMove、OnSeriesClick イベント。ResetZoom で元に戻します
ヘルプのトピックを読む

データを入れて、画像を出す

手元のデータをバインドし、ライブストリームを流し込み、どこでもチャートをレンダリングできます。

左に DB グリッド、右にチャートを表示した sgcCharts の DataSetChart デモ

データを入れて、画像を出す

CSV、JSON、任意の TDataSet をバインド

ほとんどのチャートは、クエリ結果、エクスポートしたファイル、REST の応答、グリッドの行など、すでに手元にあるデータを表示します。データソースは、AddXY を呼ぶループなしで、それらを系列に読み込みます。フィールドまたは列を指定し、データが変わったら Refresh を呼ぶだけで、チャートが追従します。データセットのソースは、ローソク足用の始値、高値、安値、終値、出来高のフィールドもマップします。データソースはコンポーネントなので、デザイン時にオブジェクトインスペクターで設定できます。Live を設定すると、コードなしでチャートがデータセットに追従します。ユーザーがグリッドでレコードを登録、削除、挿入したとき、またはフィルターを変えたときに、チャートが再読み込みされます。

  • TsgcChartDataSource_DataSet は、XField、YField、LabelField を通じて任意の TDataSet を読み取ります
  • Live は、登録、削除、挿入、フィルターの変更を TDataLink 経由で追跡し、頻度を抑えるので、変更が連続しても再読み込みは 1 回で済みます。.NET では、Live は DataTable の変更に追従します
  • FollowCursor は、ユーザーがデータセットをスクロールすると、フォーカスしたポイントを移動します(Delphi)
  • ExtraFields は、バブル、レンジエリア、箱ひげ図、ウォーターフォールの各系列のサイズ、下限、四分位、種類の列に値を渡します
  • TsgcChartDataSource_CSV と TsgcChartDataSource_JSON は、ファイルと API の応答向けです
  • TsgcChartDataSource_Table は、sgcGrid の行などメモリ上のテーブル向けです
  • TsgcChartDataSource_Manual は、コードやバックグラウンドスレッドから送り込む点向けです
ヘルプのトピックを読む

データを入れて、画像を出す 登録版のみ

グルーコードなしで、ライブの市場フィードと IoT フィード

チャートをブローカーや市場ストリームに接続すると、メッセージが届くたびにプロットします。sgcChartsWS ブリッジは、sgcWebSockets クライアントのメッセージイベントにフックし、JSON を点またはローソク足にマップします。Binance ソースは、1 秒から 1 か月までの間隔で、集計器を使って生の約定からローソク足を作成できます。ソースが停止すると、クライアントの元のイベントハンドラーを復元します。

  • TsgcChartDataSource_Binance: Symbol、Stream(cbsKLine、cbsTicker、cbsTrade)、Interval
  • TsgcChartDataSource_MQTT の TopicFilter と PayloadFormat
  • TsgcChartDataSource_WebSocket と TsgcChartDataSource_SSE は、WebSocket または Server-Sent Events 上の JSON 向けです
  • TsgcChartAggregator は、AddTrade で約定をローソク足に変換します

ブリッジには sgcWebSockets が必要です。Community では、手動データソースを使って自分のコードからチャートにデータを渡してください。

ヘルプのトピックを読む

データを入れて、画像を出す

ウィンドウ不要で、サーバーから PNG と SVG

チャートは、毎日のレポートメール、PDF、Web ページ、画像を返す REST エンドポイントなど、画面の外へ出ることがよくあります。TsgcChartRenderer は、フォームもメッセージループも使わずに、同じチャートモデルを PNG または SVG に描画します。コンソールアプリケーション、Windows サービス、Delphi 10.2 以降でビルドした Linux64 サーバーで動作します。画面上では、ビューがユーザーに見えている内容を 1 回の呼び出しで保存します。出力は画面と同じテーマ、フォント、パレットを使うので、PDF 内のチャートはダッシュボード上のチャートと全く同じ見た目になります。

  • RenderToPNGFile、RenderToPNGStream、RenderToSVGFile、RenderToSVGStream
  • 高 DPI 画像向けの Width、Height、Scale
  • TsgcVCLChart の SaveToPNG と SaveToSVG
  • Headless デモと HeadlessService デモ。.NET では esegece.sgcCharts.Rendering パッケージ
ヘルプのトピックを読む

アクセシビリティ

スクリーンリーダー、キーボード、ハイコントラスト向けの UI Automation を、設定なしで使えます。

アクセシビリティ

ポイント単位で UI Automation に公開されるチャート

sgcCharts は、タイトル、軸、凡例、系列、データポイントとともに、チャートを Microsoft UI Automation に公開します。各ポイントはカテゴリと値を公開し、チャートはアクセシブルな PDF に書き出すものと同じ代替テキストで自身を説明します。

  • 左右キーで前後のデータポイントへ、上下キーで前後の系列へ、Home と End で最初または最後のポイントへ移動します
  • Page Up と Page Down はポイント数の 10 分の 1 ずつジャンプし、Enter はフォーカスされたポイントをクリックと同様に実行し、Esc でポイントのフォーカスを解除します
  • チャートはタブストップで、表示されるフォーカスリングを備えます
  • Windows のハイコントラストテーマでは、系列はシステムカラーを使い、系列の種類が許す場合は、線のパターンとマーカーで区別されます

アクセシビリティは、無料の Community 版を含むすべてのエディションで既定で有効です。VCL では Delphi 7 から Delphi 13 までのすべての Delphi と C++Builder のバージョンで、FireMonkey では Windows で、そして WinForms、WPF、Avalonia で使えます。 Delphi と C++Builder では、AccessibleName と AccessibleDescription が UI Automation に公開される名前と説明を設定し、.NET では各フレームワーク標準のアクセシブルな名前とヘルプテキストが同じ役割を果たします。アクセシビリティ適合レポートを参照してください。 マウスによるズームとパン、および金融向けの描画ツールには、キーボードの代替手段がありません。

ヘルプのトピックを読む

sgcCharts の動作を見る

sgcUI スイートのデモに含まれる sgcCharts:組み込みのシミュレーションデータでオフラインで動作する完全なアプリケーションです。

デモとヘルプで計測した値

同梱の LiveLine デモと間引きのリファレンスから得た数値です。ご自身で再現できます。

測定項目結果条件
LiveLine のリングバッファ内の点数1,000,000TsgcChartDataSource_Manual を通じてバックグラウンドスレッドから TsgcChartSeries_FastLine に供給
ピクセル列あたりに保持する点数最大 4 点dmMinMax の間引き: 最初、最小、最大、最後の点

出典: これらの数値を解説しているヘルプのトピック。

sgcCharts の主な利用シーン

トレーディングと暗号資産のプラットフォーム

デスクのアプリケーションは、選択した銘柄のローソク足、価格ペインの移動平均とボリンジャーバンド、下のペインの RSI と出来高、気配値がストリームされている間の売り気配と買い気配のバンドを表示します。アナリストはトレンドラインとフィボナッチ水準を描画し、ズームしても固定されたままです。Binance ソースは、取引所のストリームから直接ローソク足を作成します。

  • ローソク足系列
  • 指標とペイン
  • 描画ツール
  • Binance データソース
BinanceLive デモを実行する

産業と IoT の監視

制御室のクライアントは、数十のセンサーを同時にプロットします。リングバッファを持つ高速ライン系列は、数時間分の測定値を固定のメモリで保持し、時間ウィンドウで直近の数分を表示し、間引きで再描画の負荷を抑えます。MQTT のトピックがチャートに直接データを渡し、ヒートマップはどの機械が高温になっているかを示します。

  • 高速ラインとリングバッファ
  • 時間ウィンドウ
  • MQTT データソース
  • ヒートマップ
MQTTSensors デモを実行する

業務レポートと生成画像

バックオフィスのサービスが、週次の売上ドーナツ、営業ファネル、12 か月の推移を、経営陣向けメールには PNG、イントラネットには SVG としてレンダリングします。同じチャートのコードがデスクトップアプリケーション内でも同じデータセットにバインドして動くので、数値と色は常に一致します。

  • ドーナツとファネル
  • DataSet データソース
  • TsgcChartRenderer
  • テーマ
Headless デモを実行する

A Donut Chart in a Few Lines

The same API in Delphi, C++ Builder and C#: revenue by region as a donut with an Others slice, on a dark theme, exported to PNG.

Builds the model, a pie series with a 55 percent hole, a VCL view and a renderer that writes a 1200 x 700 PNG.

uses
  Controls, sgcUICore_Theme, sgcCharts_Chart, sgcCharts_Series_Pie,
  sgcCharts_Renderer, sgcCharts_VCL;

// Revenue by region as a donut chart with an "Others" slice,
// on a dark theme, exported to PNG.
procedure BuildDonut(aOwner: TWinControl);
var
  oChart: TsgcChart;
  oView: TsgcVCLChart;
  oPie: TsgcChartSeries_Pie;
  oPNG: TsgcChartRenderer;
begin
  oChart := TsgcChart.Create(aOwner);
  oChart.Theme := utDark;
  oChart.Title.Text := 'Revenue by region';
  oChart.Legend.Position := clpRight;

  oPie := TsgcChartSeries_Pie.Create(aOwner);
  oPie.Chart := oChart;
  oPie.InnerRadiusPercent := 55;
  oPie.OthersThreshold := 4;
  oPie.OthersText := 'Others';
  oPie.ExplodeOnClick := True;
  oPie.AddItem('North America', 420);
  oPie.AddItem('Europe', 310);
  oPie.AddItem('Asia Pacific', 280);
  oPie.AddItem('Latin America', 95);
  oPie.AddItem('Middle East', 12);

  oView := TsgcVCLChart.Create(aOwner);
  oView.Parent := aOwner;
  oView.Align := alClient;
  oView.Chart := oChart;

  oPNG := TsgcChartRenderer.Create(aOwner);
  oPNG.Chart := oChart;
  oPNG.RenderToPNGFile('revenue.png', 1200, 700);
end;

ヘルプのトピックを読む →

The same donut in C++ Builder, using the generated sgcCharts_*.hpp headers.

#include <vcl.h>
#include "sgcUICore_Theme.hpp"
#include "sgcCharts_Chart.hpp"
#include "sgcCharts_Series_Pie.hpp"
#include "sgcCharts_Renderer.hpp"
#include "sgcCharts_VCL.hpp"

// Revenue by region as a donut chart with an "Others" slice,
// on a dark theme, exported to PNG.
void BuildDonut(TWinControl *aOwner)
{
  TsgcChart *oChart = new TsgcChart(aOwner);
  oChart->Theme = utDark;
  oChart->Title->Text = "Revenue by region";
  oChart->Legend->Position = clpRight;

  TsgcChartSeries_Pie *oPie = new TsgcChartSeries_Pie(aOwner);
  oPie->Chart = oChart;
  oPie->InnerRadiusPercent = 55;
  oPie->OthersThreshold = 4;
  oPie->OthersText = "Others";
  oPie->ExplodeOnClick = true;
  oPie->AddItem("North America", 420, 0);
  oPie->AddItem("Europe", 310, 0);
  oPie->AddItem("Asia Pacific", 280, 0);
  oPie->AddItem("Latin America", 95, 0);
  oPie->AddItem("Middle East", 12, 0);

  TsgcVCLChart *oView = new TsgcVCLChart(aOwner);
  oView->Parent = aOwner;
  oView->Align = alClient;
  oView->Chart = oChart;

  TsgcChartRenderer *oPNG = new TsgcChartRenderer(aOwner);
  oPNG->Chart = oChart;
  oPNG->RenderToPNGFile("revenue.png", 1200, 700);
}

ヘルプのトピックを読む →

Headless in C#: the same model rendered to PNG with no window, from the Rendering package.

using esegece.sgcCharts;
using esegece.sgcUICore;

// Revenue by region as a donut chart with an "Others" slice,
// on a dark theme, rendered headless to PNG (no window needed).
public static class RevenueDonut
{
    public static void Render()
    {
        var oChart = new TsgcChart();
        oChart.Theme = TsgcUITheme.utDark;
        oChart.Title.Text = "Revenue by region";
        oChart.Legend.Position = TsgcChartLegendPosition.clpRight;

        var oPie = new TsgcChartSeries_Pie();
        oPie.Chart = oChart;
        oPie.InnerRadiusPercent = 55;
        oPie.OthersThreshold = 4;
        oPie.OthersText = "Others";
        oPie.ExplodeOnClick = true;
        oPie.AddItem("North America", 420);
        oPie.AddItem("Europe", 310);
        oPie.AddItem("Asia Pacific", 280);
        oPie.AddItem("Latin America", 95);
        oPie.AddItem("Middle East", 12);

        var oPNG = new TsgcChartRenderer();
        oPNG.Chart = oChart;
        oPNG.RenderToPNGFile("revenue.png", 1200, 700);
    }
}
dotnet add package esegece.sgcCharts.Rendering

ヘルプのトピックを読む →

sgcCharts のデモを実行する

Delphi 向け 19 個のデモ、C++ Builder 向けの同じ 19 個、.NET 向け 12 個を、すべてコンパイル済みデモのダウンロードに収録しています。ここでは上記の機能を示すデモを紹介します。

LiveLine

LiveLine

バックグラウンドスレッドから 100 万点のリングバッファに供給する高速ライン系列です。10 秒、60 秒、またはバッファ全体の時間ウィンドウ、テーマの切り替え、ストリーム全体にわたるクロスヘアを備えます。

Candlestick

出来高軸付きの日時軸に表示する日足ローソク足です。マウスでズームとパンができ、多数のローソク足が同じピクセル列に入る場合は、正確な 1 本に統合されます。

登録版のみ DrawingTools

ローソク足チャート上でマウスを使ってトレンドライン、水平線と垂直線、長方形、フィボナッチリトレースメントを描き、選択、ロック、削除します。

DataSetChart

DataSetChart

1,000 行のクライアントデータセットを DB グリッドに表示し、2 つのデータセットソースで折れ線系列と棒系列に読み込みます。行を編集して再読み込みすると、チャートが追従します。

BusinessCharts

BusinessCharts

バブル、箱ひげ図、ウォーターフォール、滑らかな範囲エリアの各系列に、誤差バー、注釈、ISA-101 のアラームライン、ISA-101 テーマ、実行時のチャートエディターを組み合わせ、チャートが追従するライブデータセットを表示します。.NET 版は BusinessCharts、BusinessChartsWpf、BusinessChartsAvalonia です。FireMonkey 版は BusinessChartsFMX です。

登録版のみ BinanceLive

sgcChartsWS ブリッジ経由で Binance の市場ストリームからライブのローソク足を取得し、ペインと指標を備えた金融チャートに表示します。sgcWebSockets が必要です。

登録版のみ MQTTSensors

sgcChartsWS ブリッジ経由で MQTT のトピックから受け取ったセンサー値を、届いた順にプロットします。sgcWebSockets と MQTT ブローカーが必要です。

Headless

チャートを組み立て、ウィンドウなしで PNG と SVG のファイルを書き出すコンソールプログラムです。HeadlessService は同じことを Windows サービスから行います。

コンパイル済みデモ

sgcUI 全製品のすぐに実行できる実行ファイルです。インストールは不要です。

sgcUI_bin.zip をダウンロード →

sgcCharts が含まれるエディション

sgcCharts は sgcUI Professional と Enterprise に含まれ、単体でも販売しています。All-Access バンドルにも含まれます。

sgcCharts 単体パッケージ

€199 / 開発者、ソースコード一式、1 年間のアップデート付き。

sgcCharts を購入 → 価格を見る →

sgcUI Professional

Standard に加えて sgcCharts、sgcDashboard、sgcGauges、€529 から。

Professional を見る →

sgcUI Enterprise

sgcUI 全 15 製品、€699 から。

Enterprise を見る →

無料の Community 版(NuGet の esegece.sgcCharts.Community)には、17 種類すべての系列、注釈、誤差バー、ISA-101 プリセット、実行時のエディター、ビュー、バッファ、手動、CSV、JSON、データセットのソース、操作機能、ヘッドレス出力が含まれます。金融パック(指標系列と出来高系列、ペイン、集計器、描画ツール、最終値マーカー、売り気配と買い気配のバンド)、高度なテーブルリンクタイプを含むチャートデザイナー、sgcChartsWS ブリッジは含まれません。

機能Community(無料)登録版
ローソク足と OHLC を含む 17 種類の系列✓✓
高速ライン、リングバッファ、間引き✓✓
ズーム、パン、クロスヘア、ツールチップ✓✓
手動、CSV、JSON、ライブ対応データセットのデータソース✓✓
テーマ、PNG と SVG の出力、ヘッドレスレンダラー✓✓
注釈、誤差バー、ISA-101 プリセット、実行時のチャートエディター✓✓
指標系列と出来高系列−✓
ペイン、最終値マーカー、売り気配と買い気配のバンド−✓
描画ツールと約定の集計器−✓
sgcChartsWS のライブフィード(Binance、MQTT、WebSocket、SSE)−✓
テーブルリンク向けのチャートデザイナー (100% 積み上げ、円、ドーナツ、複合タイプ付き)−✓

対応フレームワークとプラットフォーム

sgcCharts のコンポーネント

Component概要
TsgcChartチャートモデル。軸、系列、凡例、テーマ、操作を扱います。
TsgcVCLChart, TsgcFMXChartVCL と FireMonkey のビューです。
TsgcChartRendererヘッドレスの PNG と SVG のレンダリング。サービスや Linux64 でも使えます。
TsgcChartSeries_*17 種類の系列と、金融指標の系列です。
TsgcChartDataSource_Manual, _CSV, _JSON, _DataSet, _Table点、ファイル、データセット、テーブル向けのデータソースです。
TsgcChartDataSource_WebSocket, _MQTT, _SSE, _BinancesgcChartsWS ブリッジのライブフィードソースです(登録版のみ)。
TargetComponent対応プラットフォーム
Delphi 7 から 13、VCLTsgcVCLChartWin32 と Win64
Delphi XE6 から 13、FireMonkeyTsgcFMXChartWindows、macOS、iOS、Android
C++ Builder 2007 から 13TsgcVCLChart, TsgcFMXChart生成された .hpp ヘッダーと静的ライブラリ
Delphi 10.2 から 13、ヘッドレスモデルと TsgcChartRendererLinux64、サーバー上の PNG と SVG
.NET Framework 4.7.2、.NET 8、9、10TsgcWinFormsChart, TsgcWpfChart, TsgcAvaloniaChartWinForms、WPF、Avalonia 12、ヘッドレスレンダリング

よくある質問

LiveLine デモは、バックグラウンドスレッドから 100 万点のリングバッファを持つ高速ライン系列にストリームします。バッファには決まった Capacity があるのでメモリは一定で、間引きにより表示する点はピクセル列あたり数点に減り、MaxFPS が再描画の頻度を制限します。コンパイル済みのデモを実行すると、お使いのマシンで確認できます。

17 種類です。折れ線、高速ライン、階段線、面、レンジエリア、棒、散布図、バブル、ローソク足、OHLC、円とドーナツ、レーダー、ヒートマップ、ツリーマップ、ファネル、箱ひげ図、ウォーターフォールです。それぞれがコンポーネントなので、必要な数の軸を使って、1 つのチャートに複数を組み合わせられます。

いいえ。Community 版にはローソク足系列と OHLC 系列が含まれますが、指標系列と出来高系列、ペイン、集計器、描画ツール、最終値マーカー、売り気配と買い気配のバンドは含まれません。これらと sgcChartsWS のライブフィードには登録版が必要です。ヘルプのエディションをご覧ください。

はい。SaveToPNG と SaveToSVG はビューに表示されている内容を保存し、TsgcChartRenderer はウィンドウなしで、指定した幅、高さ、スケールでチャートモデルを PNG または SVG のファイルやストリームにレンダリングします。PDF やメール本文に取り込む一般的な方法です。

はい、ヘッドレスで動作します。Delphi 10.2 以降では、チャートモデルと TsgcChartRenderer を Linux64 向けにコンパイルでき、PNG と SVG を出力します。Linux 用のビューコントロールはありません。.NET では、esegece.sgcCharts.Rendering パッケージが .NET Standard 2.0、.NET Framework 4.7.2、.NET 6、8、9、10 に対応します。

すべての製品ライセンスに、手動の点、CSV、JSON、任意の TDataSet、メモリ上のテーブルが含まれます。登録版と sgcWebSockets を組み合わせると、sgcChartsWS ブリッジにより、Binance の市場ストリーム、MQTT のトピック、WebSocket 上の JSON、Server-Sent Events が加わります。

sgcCharts のヘルプ

3,000+開発者
20+年
761+コンポーネント
30+API 連携
5プラットフォーム
30日間返金保証ご満足いただけない場合は、ご購入から30日以内に全額返金をリクエストできます。 返金ポリシーを見る

sgcCharts を今すぐお試しください

sgcUI 体験版には、sgcCharts とそのほかのすべての sgcUI 製品が含まれます。