ワークスペースの作成

Blockly ワークスペースは、Blockly の最上位コンポーネントです。これは UI であり、 ブロックを使ったプログラミングに使用できます。

ワークスペースとそのサブコンポーネントの詳細については、ビジュアル 用語集をご覧ください。

インジェクション div

Blockly ワークスペースは、<div> に挿入する必要があります。これを「インジェクション」という あります。

インジェクション div のサイズは静的に、または 動的にdiv 内のブロック状の要素を使用すると、 サイズを調整します。

次のコード スニペットは、静的にサイズ変更されるインジェクション div の HTML を示しています。

<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>

インジェクション

インジェクションにより、HTML のサブ要素がすべて作成され、 できます。また、ワークスペースを取得するために必要な初期化もすべて行われます。 使用できます。

インジェクション関数には、インジェクション div の ID またはインジェクション :

// Passes the ID.
const workspace = Blockly.inject('blocklyDiv', { /* config */ });

// Passes the injection div.
const workspace = Blockly.inject(
    document.getElementById('blocklyDiv'), { /* config */ });

構成

ワークスペースは多数のオプション（レイアウトやスタイルなど）を使用して構成できる 確認できます。

構成オプションの詳細については、このモジュールの 構成オプション。