突然、同じインターフェイスにいくつかの異なる知識ポイントを掲載してボックスに入れることができれば、アイデアがあります。したがって、何かを見たい場合は、直接表示できます。このボックスは開くことができなければなりません。エッセンスHTを使用して、100ライン以上のコードで自分のアイデアを実現したため、この効果を達成できるコードはほとんどありません。
レンダリングを見てみましょう：
この例の最も基本的なのは最も外側のボックスですので、それを達成する方法を見てみましょう。
var box = new ht.csgbox（）;
HTを使用すると、多くの基本的なグラフィックタイプがHTにカプセル化されています。
この例で使用されているカプセル化された基本マップは、ht.csgboxです。あなたは、いくつかの特別な機能を自分で設定したい場合は、操作する必要があります。 Ht.Style（WebスタイルマニュアルのHT）。
ボックスの片側にステッカーを追加したい場合は、私が考えることができるのは、ht.default.setimage関数がカプセル化されていることです。
ここで実装した方法は、HTのエディターを操作して、GraphViewコンポーネントとDataModelデータモデルを再定義し、メソッドJSON形式でJSONを呼び出し、次にディフリエが表示されます。 VisualインターフェイスとしてのJSONのコンテンツは、アニメーションを設定し、その後、このJSONのインターフェースをすぐにリフレッシュします。
ht.default.xhrload（ 'displays/demo/pump.json'、function（text）{const json = ht.default.parse（text）; pumpdm.deserialize（json）; var cureant Rotation = 0; var lasttime = new = new date（）.getTime（）; setinterval（）{var time = new date（）; var deltame = time -lasttime; * 0.3; last = time; pumpdm .getDatabytag（ 'fan1'）。 （currentRotation）; pumpdatabytag（ 'fan2'）がg3dを更新することもできます。現時点では、PumpGVとG3Dを下部DIVに追加することはできません。私の意図は、G3DのCSGBoxの側面にPOMPGVを追加することです。完全ではありません。ディスプレイへのこの広い高さの影響を確認したい場合は、自分で変更できます。
pumpgv.getWidth = function（）{return 600;} pumpgv.getheight（）{return 600;} pumpgv.getCanvas（）Echartsチャートの表示も非常に基本的です。
最終的に、これらの2つの返されたキャンバスをht.default.setimage ::に渡すだけでいいです
ht.default.setimage（ 'echart'、charts（option））;
ht.default.drawimage関数は新しい図を生成します。実際にキャンバスに写真を描くため、写真を生成するためにht.default.setimageに描かれたキャンバスを渡すだけです。
1つのことは、ラインセグメント、グラフィック、テキストを使用する必要があります。透明性がある場合、すべてを設定する必要があります。
透明性を設定できます。それを表示する必要があります。完了後のレンダリングを見てください：
要約します上記は、JSONとECHARTSチャートのHTMLベースのWebGLの実装です。 VEVBウーリンのウェブサイトへのご支援ありがとうございます！