English
Русский
中文
Español
Deutsch
Português
読み取り専用
renderScheme(host, paletteUrl, scheme) — 完成したスキームを記事・ドキュメント・製品ページに埋め込みます。
ダイアグラム JS
ダイアグラム JS — Designer のストラテジー・スキームをページ上にそのまま描画するブラウザ用コンポーネントです。同じブロック、ポート、接続、同じ見た目。外部依存はなく、すべて 1 枚の canvas に描かれます。 下のスキームは画像ではなくコンポーネントそのものです。ドラッグで移動、ホイールで拡大、全画面表示もできます。 0外部依存2動作モードnpmインストール 読み取り専用 re...
0
ダウンロード数
☆☆☆☆☆
評価
0
レビュー
ダイアグラム JS — Designer のストラテジー・スキームをページ上にそのまま描画するブラウザ用コンポーネントです。同じブロック、ポート、接続、同じ見た目。外部依存はなく、すべて 1 枚の canvas に描かれます。
下のスキームは画像ではなくコンポーネントそのものです。ドラッグで移動、ホイールで拡大、全画面表示もできます。
0
外部依存
2
動作モード
npm
インストール
エディター
StockSharpDiagram — ブロックのドラッグ、ポートの接続、変更を伝えるイベント。
デザイナーのパレット
要素の種類・ポート・配色は Designer と同じパレットから取得します。どこで見ても同じ見た目です。
スキームはノードと、そのポート同士をつなぐリンクだけです。覚えることはこれ以上ありません:
import { renderScheme } from '@stocksharp/diagram/embed';
const scheme = {
nodes: [
{ id: 'candles', typeId: 'CandleElement', name: 'ローソク足', x: 60, y: 130 },
{ id: 'sma', typeId: 'IndicatorElement', name: 'SMA', x: 340, y: 60 },
{ id: 'chart', typeId: 'ChartElement', name: 'チャート', x: 620, y: 130 },
],
links: [
{ from: 'candles', fromPort: 'Output', to: 'sma', toPort: 'Input' },
{ from: 'sma', fromPort: 'Output', to: 'chart', toPort: 'Input' },
],
};
renderScheme(document.getElementById('diagram'), '/palette.json', scheme);