Mindが採用したGUIエンジンであるTcl/Tkは簡単なドロー系ソフトが作れるぐらいの高機能なグラフィック機能を持っています。そのグラフィック機能はすべて「キャンバス」と呼ばれるウィジェットによって実現されます。
キャンバスウィジェットの作成
図形などの座標を指定する場合、キャンバス左上隅が原点（0, 0）となります。
・座標とサイズの単位
以降の構文に書かれている座標、サイズ、移動量 などは断りの無い限り、ピクセル単位です。個々の構文内では触れませんのでご注意願います。
■キャンバスウィジェットのＩＤ取得
構文＝
＜ウィンドウＩＤ＞と ＜横サイズ＞と ＜縦サイズ＞と ＜背景色＞で キャンバスを立て → キャンバスＩＤ 注：背景色については 「ウィジェットの属性指定」−「ウィジェットの文字色と背景色」 の解説を参照してください。
キャンバスは ＩＤ。 *1 ・・・・・・・・・・・・・・・・・・・・ ・・・・・・・・・・・・・・・・・・・・ ・・この間で各種イベントの処理を記述・・ *1 ・・・・・・・・・・・・・・・・・・・・ ・・・・・・・・・・・・・・・・・・・・ メインとは メインウィンドウと ６００と ４６０と 白色で キャンバスを立て キャンバスに 入れ ・・・・し ・・・・すること。 注1：イベント処理でキャンバスを操作することが多く、 どのソース位置からもIDを参照できるよう、IDは 大域変数に格納しておきます
- 注
- キャンバスＩＤを格納する変数は「○○は ＩＤ」で宣言します。
一方、図形のＩＤを格納するには「○○は 図形ＩＤ」で宣言します。キャンバスを扱うプログラムては両者混在するため注意が必要です。
■キャンバスのクリア
構文＝
＜キャンバスＩＤ＞を キャンバスをクリア → ・
キャンバスを キャンバスをクリアする
基本的な作画機能
直線や円など、線を使った多くの作画機能があります。
■図形ＩＤと変数宣言について
図形ＩＤを格納するための変数の宣言は、例えば、
直線１は 図形ＩＤ ←局所変数
○○とは 直線１は 図形ＩＤ ・・と ・・で 直線のＩＤを取得し 直線１に 入れ 直線１を 描画し ↑ 変数名の記述が必須！
直線１は 図形ＩＤ。 ←イベント処理でも参照する場合は大域変数として確保 イベント処理とは ↓ここからもアクセスする ・・を 直線１に ○○設定し 直線１を 変更を反映し。 ○○とは ・・と ・・で 直線のＩＤを取得し 直線１に 入れ ←最初の変数格納 直線１を 描画し。
他方、 「無属性タグを付け一つ円を表示とは」 から始まる定義では図形ＩＤを大域変数に格納しています。後から操作できるようにするためです。
■直線
構文＝
（ID取得） ＜キャンバスＩＤ＞と ＜始点Ｘ＞ ＜始点Ｙ＞ ＜終点Ｘ＞ ＜終点Ｙ＞で 直線のＩＤを取得 → 図形ＩＤ （属性設定） ・・・を ＜図形ＩＤ＞に ・・設定する （描画） ＜図形ＩＤ変数＞を 描画 → ・ ↑変数名の記述必須
構文＝
＜キャンバスＩＤ＞と ＜始点Ｘ＞ ＜始点Ｙ＞ ＜終点Ｘ＞ ＜終点Ｙ＞で 直線を描く → 図形ＩＤ
直線１は 図形ＩＤ キャンバスと 18 18 68 68で 直線を描き 直線１に 入れ
このタイプではＩＤの取得のみを行い、後続して属性を設定したのち、「描画」により実際の描画がおこなわれます。
（記：描画時点での属性設定はできませんが、描画後の再設定は可能です）
■正方形
記： 以降の構文図では、先の「直線のＩＤを取得」で解説したような ＩＤ取得、 属性設定、 描画 ・・の３ステップでの手順説明は煩雑なので省きます。しかし直線の時と同様に属性設定して構いません。
構文＝
（形式１） ＜キャンバスＩＤ＞と ＜始点Ｘ＞ ＜始点Ｙ＞ ＜一辺の長さ＞で 正方形のＩＤを取得 → 図形ＩＤ （形式２） ＜キャンバスＩＤ＞と ＜始点Ｘ＞ ＜始点Ｙ＞ ＜一辺の長さ＞で 正方形を描く → 図形ＩＤ 記：形式２はＩＤ取得から描画まで一気に行いますが 描画時点での属性設定はできません
正方形１は 図形ＩＤ （形式１） キャンバスと 428 18 50で 正方形のＩＤを取得し 正方形１に 入れ 正方形１を 描画する （形式２） キャンバスと 428 18 50で 正方形を描き 正方形１に 入れ
正方形の左上隅の座標および一辺の長さを指定します。
■長方形
構文＝
（形式１） ＜キャンバスＩＤ＞と ＜始点Ｘ＞ ＜始点Ｙ＞ ＜終点Ｘ＞ ＜終点Ｙ＞で 長方形のＩＤを取得 → 図形ＩＤ （形式２） ＜キャンバスＩＤ＞と ＜始点Ｘ＞ ＜始点Ｙ＞ ＜終点Ｘ＞ ＜終点Ｙ＞で 長方形を描く → 図形ＩＤ 記：形式２はＩＤ取得から描画まで一気に行いますが 描画時点での属性設定はできません
長方形１は 図形ＩＤ （形式１） キャンバスと 218 18 368 68で 長方形のＩＤを取得し 長方形１に 入れ 長方形１を 描画する （形式２） キャンバスと 218 18 368 68で 長方形を描き 長方形１に 入れ
長方形の左上隅を始点とし、右下隅を終点とする２つの座標を指定します。
■折れ線
構文＝
（形式１） ＜キャンバスＩＤ＞と ＜Ｘ１＞ ＜Ｙ１＞と ※座標１ ＜Ｘ２＞ ＜Ｙ２＞と ※座標２ ＜Ｘ３＞ ＜Ｙ３＞と ※座標３ ・・・・・と ＜座標個数＞で ←これを忘れないで 折れ線のＩＤを取得 → 図形ＩＤ （形式２） ＜キャンバスＩＤ＞と ＜Ｘ１＞ ＜Ｙ１＞と ※座標１ ＜Ｘ２＞ ＜Ｙ２＞と ※座標２ ＜Ｘ３＞ ＜Ｙ３＞と ※座標３ ・・・・・と ＜座標個数＞で ←これを忘れないで 折れ線を描く → 図形ＩＤ 記：座標個数は X,Y のセットを１個と数えます。最大100座標まで 記：最後に個数を積むことを忘れないでください 記：形式２はＩＤ取得から描画まで一気に行いますが 描画時点での属性設定はできません
折れ線１は 図形ＩＤ （形式１） キャンバスと 88 18 128 63 170 63 190 25と ４個で 折れ線のＩＤを取得し 折れ線１に 入れ 折れ線１を 描画する （形式２） キャンバスと 88 18 128 63 170 63 190 25と ４個で 折れ線を描き 折れ線１に 入れ
折れ線を構成する各点の座標を列挙し、最後に座標の個数を積んでから処理単語を呼びます。座標個数はXとYが１セットで１個と数えます。
■多角形
構文＝
（形式１） ＜キャンバスＩＤ＞と ＜Ｘ１＞ ＜Ｙ１＞と ※座標１ ＜Ｘ２＞ ＜Ｙ２＞と ※座標２ ＜Ｘ３＞ ＜Ｙ３＞と ※座標３ ・・・・・と ＜座標個数＞で ←これを忘れないで 多角形のＩＤを取得 → 図形ＩＤ （形式２） ＜キャンバスＩＤ＞と ＜Ｘ１＞ ＜Ｙ１＞と ※座標１ ＜Ｘ２＞ ＜Ｙ２＞と ※座標２ ＜Ｘ３＞ ＜Ｙ３＞と ※座標３ ・・・・・と ＜座標個数＞で ←これを忘れないで 多角形を描く → 図形ＩＤ 記：座標個数は X,Y のセットを１個と数えます。最大100座標まで 記：最後に個数を積むことを忘れないでください 記：形式２はＩＤ取得から描画まで一気に行いますが 描画時点での属性設定はできません
多角形１は 図形ＩＤ （形式１） キャンバスと 18 372 68 320 118 370 93 440 53 440と ５個で 多角形のＩＤを取得し 多角形１に 入れ 多角形１を 描画する （形式２） キャンバスと 18 372 68 320 118 370 93 440 53 440と ５個で 多角形を描き 多角形１に 入れ
多角形を構成する各点の座標を列挙し、最後に座標の個数を積んでから処理単語を呼びます。座標個数はXとYが１セットで１個と数えます。
なお、本処理単語が描画するのは「正多角形」ではなく「多角形」なので注意してください。正多角形を描画するにはユーザがそのための精密な座標を指定する必要があります。
■円
構文＝
（形式１） ＜キャンバスＩＤ＞と ＜中心Ｘ＞ ＜中心Ｙ＞ ＜半径＞で 円のＩＤを取得 → 図形ＩＤ （形式２） ＜キャンバスＩＤ＞と ＜中心Ｘ＞ ＜中心Ｙ＞ ＜半径＞で 円を描く → 図形ＩＤ 記：形式２はＩＤ取得から描画まで一気に行いますが 描画時点での属性設定はできません
円１は 図形ＩＤ （形式１） キャンバスと 453 43 25で 円のＩＤを取得し 円１に 入れ 円１を 描画する （形式２） キャンバスと 453 43 25で 円を描き 円１に 入れ
円の中心の座標および半径をピクセル単位で指定します。
■楕円
構文＝
（形式１） ＜キャンバスＩＤ＞と ＜始点Ｘ＞ ＜始点Ｙ＞ ＜終点Ｘ＞ ＜終点Ｙ＞で 楕円のＩＤを取得 → 図形ＩＤ （形式２） ＜キャンバスＩＤ＞と ＜始点Ｘ＞ ＜始点Ｙ＞ ＜終点Ｘ＞ ＜終点Ｙ＞で 楕円を描く → 図形ＩＤ 記：形式２はＩＤ取得から描画まで一気に行いますが 描画時点での属性設定はできません
楕円１は 図形ＩＤ （形式１） キャンバスと 218 18 368 68で 楕円のＩＤを取得し 楕円１に 入れ 楕円１を 描画する （形式２） キャンバスと 218 18 368 68で 楕円を描き 楕円１に 入れ
座標は、楕円に外接する長方形の始点・終点の座標となります。つまり、座標指定に関しては長方形の描画と同じになります。
■円弧
構文＝
＜キャンバスＩＤ＞と ＜中心Ｘ＞ ＜中心Ｙ＞ ＜半径＞で 円弧のＩＤを取得 → 図形ＩＤ ＜開始角度＞ ＜描画角度＞を ＜図形ＩＤ＞に 開始・描画角度を設定 → ・ ＜円弧の種類＞を *1 ＜図形ＩＤ＞に 円弧の種類を設定 → ・ ＜図形ＩＤ変数＞を 描画 ↑変数名の記述必須 注１：円弧の種類は文字列で、以下のいずれかのシンボルを指定 円弧単独 円弧と中心点を結ぶ 円弧と始点終点を結ぶ
円弧１は 図形ＩＤ キャンバスと 453 43 25で 円弧のＩＤを取得し 円弧１に 入れ 0と 270で 円弧１に 開始・描画角度を設定し 円弧と始点終点を結ぶで 円弧１に 円弧の種類を設定 円弧１を 描画する
円弧の中心の座標および半径をピクセル単位で指定します。
円弧と中心点を結ぶ
円弧と始点終点を結ぶ
構文＝
＜キャンバスＩＤ＞と ＜始点Ｘ＞ ＜始点Ｙ＞ ＜終点Ｘ＞ ＜終点Ｙ＞で 楕円弧のＩＤを取得 → 図形ＩＤ ＜開始角度＞ ＜描画角度＞を ＜図形ＩＤ＞に 開始・描画角度を設定 → ・ ＜円弧の種類＞を ＜図形ＩＤ＞に 円弧の種類を設定 → ・ ＜図形ＩＤ変数＞を 描画 ↑変数名の記述必須 注１：円弧の種類は文字列で、以下のいずれかのシンボルを指定 円弧単独 円弧と中心点を結ぶ 円弧と始点終点を結ぶ
楕円弧１は 図形ＩＤ キャンバスと 218 18 368 68で 楕円弧のＩＤを取得し 楕円弧１に 入れ 0と 270で 楕円弧１に 開始・描画角度を設定し 円弧と始点終点を結ぶで 楕円弧１に 円弧の種類を設定 楕円弧１を 描画する
円弧と中心点を結ぶ
円弧と始点終点を結ぶ
構文＝
＜図形ＩＤ変数＞を 描画する → ・ ↑変数の記述必須
ソース上、本処理単語の前にはＩＤを格納している変数の名前が必ず書かれている必要があります。
本処理単語から戻って来るとＩＤ変数の内容が変化します（変数が強制的に書き換わります）
属性設定があるなら、”描画する”より前におこなってください。
図形への属性設定
処理単語 「○○のＩＤを取得」 でＩＤを取得した図形は、「描画」の前に属性を設定することができます。
いずれも、図形描画後に属性を変更した場合は最後に「変更を反映」を実行して変更を反映させる必要があります。
注１： 以下で 「ＩＤorタグ」 と書いた部分は、図形ＩＤまたは図形タグＩＤを指定することを意味します。
注２： ある図形に対して各種属性だけをおこない、「描画」または「変更を反映」せずにさらに別の図形の属性の設定をおこなうような書き方では、確定が保留される図形数は７個に制限されます。
７個あるから大丈夫と思われるかも知れませんが、保留している間にイベントが発生してそこでも属性設定をおこなう可能性もあるため、原則としては１つの図形への一連の属性設定のあとその都度「描画」または「変更を反映」して確定するようにしてください。
■線の太さ
構文＝
＜ピクセル数＞を ＜ＩＤorタグ＞に 線の太さを設定 → ・
３を 折れ線１に 線の太さを設定し
０を指定すると枠線無しになり、円や長方形など閉じた図形では塗りつぶしと併用して使われることがあります。
■線の色
構文＝
＜色指定＞を ＜ＩＤorタグ＞に 線の色を設定 → ・
「green」を 折れ線１に 線の色を設定し
＜色指定＞については既に、「ウィジェットの属性指定」−「ウィジェットの文字色と背景色」 にて解説したので参照してください。
■満たす色
構文＝
＜色指定＞を ＜ＩＤorタグ＞に 満たす色を設定 → ・
「#c0c000」を 楕円１に 満たす色を設定し
＜色指定＞については既に、「ウィジェットの属性指定」−「ウィジェットの文字色と背景色」 にて解説したので参照してください。
■スムージング
構文＝
＜レベル＞を ＜ＩＤorタグ＞に スムージングを設定 → ・ レベル：正数で０あるいは１〜１２程度
０を 折れ線１に スムージングを設定する
最大のなめらかさにしたい場合は１２を使うよりむしろ、０を指定してください。（サンプルプログラムではすべて０を指定しています）
「図形の描画」−「基本作画」をたどると基本的な作画が行われますが、一番右の列にある”なめらかな折れ線”が本機能を使っています。
■矢印
構文＝
＜矢印シンボル＞を ＜ＩＤorタグ＞に 矢印を設定 → ・ 矢印シンボルとして以下のいずれかの語を指定： 始点に矢印 終点に矢印 両端に矢印
始点に矢印を 折れ線１に 矢印を設定
■変更を反映
構文＝
＜ＩＤorタグ＞を 変更を反映 → ・
折れ線１を 変更を反映する
レイヤ
複数の図形を描画したとき、それぞれの図形ごとにレイヤが割り当てられます。
図形を２つ描画した場合、１番目の図形より２番目の図形が手前になります。
２つの図形が重なっている場合は１番目の一部が２番目の後ろに隠されることになりますが２番目の図形を取り除くと１番目のすべてが自動的に表示されます。
サンプルプログラム "canvas-basic.exe" の「図形の描画」−「円を５つ表示」を選ぶと５つの円がそれぞれ重なって表示されていることが分かります。このあと、「図形の操作」−「５つ円の２番を３番の上へ」を選ぶと本来であれば２番は３番の後ろに隠れているはずなのに３番より手前に表示されるようになります。
本セクションはこのようなレイヤの操作をプログラムから行う方法を解説します。
■図形の重なりの操作
構文＝
＜ＩＤorタグ＞を 図形の重なりを最上位へ → ・ ＜ＩＤorタグ＞を 図形の重なりを最下位へ → ・ ＜ＩＤorタグ１＞を ＜ＩＤorタグ２＞にたいし 図形の重なりを上へ → ・ ＜ＩＤorタグ１＞を ＜ＩＤorタグ２＞にたいし 図形の重なりを下へ → ・ ↑注：「対し」ではなく「たいし」 注：「たいし」という送り仮名はプログラムとしては意味がありませんが 意図を示すために書いています
サンプルプログラム "canvas-basic.exe" の「図形の描画」−「円を５つ表示」によって５つの円を表示したあと「図形の操作」−「５つ円の２番を３番の上へ」〜以降のメニュー選ぶことで実際の見え方を確認してください。
図形にタグを使う
■図形にタグを使う理由
■図形タグの生成と属性設定
構文＝
＜キャンバスＩＤ＞で 図形タグのＩＤを取得 → タグＩＤ 〜略〜 （各種属性設定）
円のタグは 図形ＩＤ キャンバスで 図形タグのＩＤを取得し 円のタグに 入れ 「#c000c0」を 円のタグに 満たす色を設定し
タグＩＤは後続して各種属性設定をおこなったり、タグを任意の図形に適用するのに使われます。
この段階ではタグは無属性であり、後続して線の太さや色などを設定できますが、タグを無属性のまま使う用途もあります（グループ化目的の場合）。
図形に対して属性を設定できたのとまったく同じに、タグに対しても属性を設定できます。少し前の解説、図形への属性設定 を参照願います。
■図形にタグを付与
構文＝
＜タグＩＤ＞を ＜図形ＩＤ＞に 図形にタグを付与 → ・
円は 図形ＩＤ 円のタグは 図形ＩＤ キャンバスで 図形タグのＩＤを取得し 円のタグに 入れ 「#c000c0」を 円のタグに 満たす色を設定し 円のタグを 円に 図形にタグを付与し
- 注
- 描画前の図形へのタグの付与は１個までしか効きません。描画後に付与して最後に「変更を反映」する方法であれば何個でも付与できま。
■図形からタグを取り除き
構文＝
＜図形ＩＤ＞から ＜タグＩＤを＞を 図形からタグを取り除き → ・
円１から 太線タグを 図形からタグを取り除き
タグに属性が設定されていた場合、タグ経由で図形に付与されていた属性はタグを取り除いた後も図形に”残ります”。
- 注
- タグを指定しての「図形を削除」と、「図形からタグを取り除き」を混同しないように注意してください。後者は図形を削除する機能ではありません。
イメージの描画
記： イメージの描画は例外的に「描画」は不要です。
「図形として・・を描く」という単語名になっているのは
それを表すためです
■図形としてイメージを描く
記： 下記で 「イメージＩＤ」 を指定する個所があります。
イメージＩＤの生成方法については別途、「イメージ」−「イメージデータの生成」 を参照してください。
構文＝
＜キャンバスＩＤ＞と ＜イメージＩＤ＞と ＜中心Ｘ＞ ＜中心Ｙ＞と ＜基準点指示＞で 図形としてイメージを描く → 図形ＩＤ 基準点として以下のいずれかのシンボルを記述（文字列定数） 上端 下端 左端 右端 左上隅 ←デフォルト 左下隅 右上隅 右下隅 中央
猫のイメージは 変数 猫のＩＤは 図形ＩＤ （ステップ１） ※描画のための準備 "mage\cat.png"を イメージをロードし 猫のイメージに 入れ （ステップ２） ※描画処理 キャンバスと 猫のイメージと 200, 300と 中央で 図形としてイメージを描き 猫のＩＤに 入れ
■図形としてビットマップを描く
構文＝
＜キャンバスＩＤ＞と ＜ビットマップ名＞と ＜背景色＞と ＜中心Ｘ＞ ＜中心Ｙ＞と ＜基準点指示＞で 図形としてビットマップを描く → 図形ＩＤ
○○とは ビットマップ１は 図形ＩＤ キャンバスと ビットマップ・questheadと 黄色と 200, 300と 右下隅で 図形としてビットマップを描き ビットマップ１に 入れ
■基準点について
イメージを描画するのに座標を指定しますが、点の位置である座標に比べ、描画されるイメージは広さのある領域であり、最終的な表示位置があいまいです。このあいまいさを解消するための指示となります。
−−−−−−−−−−−−−− 上端 下端 左端 右端 左上隅 左下隅 右上隅 右下隅 中央 −−−−−−−−−−−−−−プログラム例：
キャンバスと 猫のイメージと 200, 300と 左上隅で ←−ここで指定 図形としてイメージを描き 猫のＩＤに 入れ
テキストの描画
キャンバスにテキストを描画（貼り付け）することができます。
構文＝
＜キャンバスＩＤ＞で ＜文字列＞を ＜Ｘ＞ ＜Ｙ＞に 図形としてテキストのＩＤを取得 → 図形ＩＤ ・・属性設定・・ ＜図形ＩＤ＞を 描画する
描画されるテキストは広さのある領域であり厳密な表示位置があいまいです。このあいまいさを解消するため、「基準点を設定」と組み合わせて使用します（「基準点を設定」は少し前の解説 基準点について を参照してください）。
たとえば「左上隅」を基準点にしたときは、指定座標がテキストの左上隅と合致するような場所に表示されます。
逆に描画すべきテキストの長さが短い時は、「テキストの幅を設定」で設定した長さより短く終わり、引き延ばされたりしません。
構文＝
＜色指定＞を ＜図形ＩＤ変数＞に 文字色を設定 → ・ ＜色指定＞を ＜図形ＩＤ変数＞に 背景色を設定 → ・ ＜フォント情報＞を ＜図形ＩＤ変数＞に フォントを設定 → ・ ＜ピクセル数＞を ＜図形ＩＤ変数＞に テキストの幅を設定 → ・ ※注１,２ ＜揃え指定＞を ＜図形ＩＤ変数＞に テキスト揃えを設定 → ・ ※注３ ＜基準点指示＞を ＜図形ＩＤ変数＞に 基準点を設定 → ・ ※注４ 注１：幅の指定はピルセル単位です。詳細は 「ウィジェットの属性指定」−「ウィジェットのサイズの指定」 と同じなので参考にしてください 注２：テキストの高さは設定できません 注３：テキスト揃えのデフォルトは「左揃え」です。詳細は 「ウィジェットの属性指定」−「ウィジェット中の文字の揃え方」 を参照してください 注４：「基準点を設定」は少し前の 基準点について を参照してください
キャンバスは ＩＤ。 ○○とは テキスト１は 図形ＩＤ 〜略〜 キャンバスと 「こんにちは」を 102 102で 図形としてテキストのＩＤを取得し テキスト１に 入れ １４０を テキスト１に テキストの幅を設定し 中央揃えを テキスト１に テキスト揃えを設定し 左上隅を テキスト１に 基準点を設定し テキスト１を 描画し
構文＝
＜図形ＩＤ変数＞を 変更を反映 → ・ ↑変数の記述必須
○○押下処理とは 赤色を テキスト１記憶に 文字の色を設定し テキスト１記憶を 変更を反映し
"canvas-basic.exe"を実行し、「図形の描画」−「テキスト作画」で 動作を確認してください。
ウィジェットの描画
キャンバスに一般のウィジェット（ラベルやボタンなど）を描画できます。
構文＝
＜キャンバスＩＤ＞と ＜ウィジェットＩＤ＞を ＜Ｘ＞ ＜Ｙ＞に 図形としてウィジェットのＩＤを取得 → 図形ＩＤ
ラベル１は ＩＤ 図形のラベル１は 図形ＩＤ （ステップ１−ラベルウィジェットを作成） キャンバスで ラベルのＩＤを取得し ラベル１に 入れ 「ラベル」を ラベル１に テキストを設定し ラベル１を 有効化し （ステップ２−ラベルウィジェットを描画） キャンバスで ラベル１を 130 250で 図形としてウィジェットのＩＤを取得し 図形のラベルに 入れ 図形のラベルを 描画し
そのあと、座標を指定し「図形としてウィジェットのＩＤを取得」おこなうと図形ＩＤが得られ、「描画」すれば描画されます。
図形の操作
図形の削除、移動、拡大／縮小、レイヤの操作など各種操作について解説します。（レイヤの操作は本セクションではなく レイヤ をお読みください）
■図形を削除
構文＝
＜図形ＩＤ変数＞を 図形を削除 → ・ ↑変数の記述必須
サンプルプログラム "canvas-basic.exe" について、記： タグ経由での図形削除の場合、間接的に削除されることになる図形については、そのIDを格納する変数はクリアはされずに残ります
「図形の操作」−「太線タグを使い図形削除」
注： タグを指定しての図形を削除と、”図形からタグを取り除き”を混同しないように注意してください。後者は図形を削除する機能ではありません。
■図形を拡大・縮小
構文＝
＜ＩＤorタグ＞を ＜基準点Ｘ＞ ＜基準Ｙ＞と ＜比率Ｘ＞ ＜比率Ｙ＞で 図形を拡大・縮小 → ・ 注：比率は小数で指定します
（縮小） 円１を 50 100 0.7 0.7で 図形を拡大・縮小 （拡大） 円１を 50 100 1.3 1.3で 図形を拡大・縮小
図形を拡大・縮小する際、「どの位置から見て拡大・縮小するのか」の指定が必要になります。
たとえば図形が円なら、円の中心を基準にすることが一つ考えられます。その場合は円を描画した際の中心座標をそのまま基準点にし拡大・縮小すると同心円のように描かれます。
一方、別の場所を基準点に設定することもできます。たとえば円の左端を指定して縮小すれば、円を左端位置で保持したまま右側のほうが左に寄せる形で縮小されることになります。
■図形を移動
構文＝
＜ＩＤorタグ＞を ＜移動量Ｘ＞ ＜移動量Ｙ＞だけ 図形を移動 → ・
円１を 30 15だけ 図形を移動し
■図形を絶対値で移動
構文＝
＜ＩＤorタグ＞を ＜移動先Ｘ＞ ＜移動先Ｙ＞に 図形を絶対値で移動 → ・
円１を 30 15に 図形を絶対値で移動し
タグを使った図形グループを移動する場合の移動先ですが、グループ内で最初に描画した図形が代表となります。その代表図形の位置を別の位置に移動させる扱いになります。
■図形の座標を得る
構文＝
＜図形ＩＤ＞で 図形の座標を得る → Ｘ、Ｙ、 Ｘ、Ｙ、 Ｘ、Ｙ、・・・、個数 記：返される座標は整数でGUIエンジン内部仕様です 記：返すことのできる座標数は最大100個(X/Yのペアで1個)まで
返される座標はその図形の描画に必要な数だけ返されるのでデータ数は不定で変則的な戻値となります。（スタックトップにはデータ数が積まれています）
たとえば、
■不定個数の座標をモニタ表示する
構文＝
Ｘ、Ｙ、 Ｘ、Ｙ、 Ｘ、Ｙ、・・・、＜個数＞を 座標ペア群を文字列化 → 文字列 記：個数自身は文字列化されません
キャンバスと 453 43 25で 円を描き 円１に 入れ 円１の 図形の座標を得て 座標ペア群を文字列化
■Mindでの座標指示とGUIエンジンの座標との違い
Mindレベルでは中心点座標と半径を与えれば描画できます。
しかし,GUIエンジン内部の処理としては、円は楕円として扱われておりさらには、楕円の座標とはその楕円が内接する長方形の対角２点の座標を指定する仕様になっています。
GUIエンジンの仕様のままでは扱いずらいため、MindのGUIライブラリが介入をおこなうことで、円については中心点と半径で指定できるようになっています。
・円（GUIエンジンでは楕円扱い）
・円弧（GUIエンジンでは楕円弧扱い）
Mindでの描画 ：100 100 50
図形の座標を得る：50,50 150,150
■座標変換をおこなう処理単語
構文＝
（ネイティブ座標 → Mind座標） ＜始点Ｘ＞ ＜始点Ｙ＞ ＜終点Ｘ＞ ＜終点Ｙ＞を ネイティブ座標を円座標に変換 → 中心Ｘ、中心Ｙ、半径 ＜始点Ｘ＞ ＜始点Ｙ＞ ＜終点Ｘ＞ ＜終点Ｙ＞を ネイティブ座標を正方形座標に変換 → 始点Ｘ、始点Ｙ、一辺の長さ （Mind座標 → ネイティブ座標） ＜中心Ｘ＞ ＜中心Ｙ＞ ＜半径＞を 円座標をネイティブ座標に変換 → 始点Ｘ、始点Ｙ、終点Ｘ、終点Ｙ ＜始点Ｘ＞ ＜始点Ｙ＞ ＜一辺の長さ＞を 正方形座標をネイティブ座標に変換 → 始点Ｘ、始点Ｙ、終点Ｘ、終点Ｙ
○○とは 円１は 図形ＩＤ 始点Ｘは 変数 始点Ｙは 変数 半径は 変数 〜略〜 円１の 図形の座標を得て ４と 異なる ならば 「図形の座標を得てのデータ数異常」で 重大エラー つぎに ネイティブ座標を円座標に変換し 始点Ｘと 始点Ｙと 半径に 入れ
図形の特定・検索
キャンバス内のある図形をマウスでクリックしたとして、人なら「この図形」と分かることですが、プログラムでそれを特定するには特別な仕組みが必要になります。このセクションではそのような仕組みを解説します。
記： サンプルプログラム "canvas-event.exe" を使うと本項のすべての機能を動作確認できます。このサンプルを動かしながら以下をお読みください。
マウスイベント
マウスイベントの登録とイベントが発生したときの処理については既に 「バインドとイベント名」−「マウスイベントのバインド」 で解説したのでそちらを参照してください。
マウスイベント処理（クリックなどのイベントが発生したときに実行される処理単語）の例を改めて掲載します。
プログラム例： （再度掲載）
マウスイベント処理とは （イベント名、Ｘ座標、Ｙ座標、３(パラメータ数) → ・） イベント名は 文字列 Ｘ座標は 変数 Ｙ座標は 変数 （パラメータ数が） ３と 異なる ならば 「マウスイベント処理においてパラメータ数誤り」で 重大エラー つぎに イベント名と Ｘ座標と Ｙ座標に 入れ イベント名が 左クリックに 等しい文字列 ならば ※−−−−−−−※ ※ 左クリック ※ ※−−−−−−−※ ・・左クリック時の処理・・ さもなければ 〜略〜
図形の登録
この理由は、「クリック可能な図形」域にある図形群は図形登録していないため、図形の検出対象とならないからです。
このように、図形検出の機構を使うには、あらかじめ検出対象としたい図形を登録しておく必要があります。
■図形の登録を開始
構文＝
図形の登録を開始 → ・
■検索対象の図形を登録
構文＝
＜図形ＩＤ＞を 検索対象の図形を登録 → ・ 指定する図形は描画済みである必要があります
円を一つ表示とは （・ → ・） 円１は 図形ＩＤ キャンバスと 100 100 50で 円のＩＤを取得し 円１に 入れ 円１を 描画し 円１を 検索対象の図形を登録し
なお、図形を削除した場合は検索対象から自動的に抹消されます。（タグ指定での間接的な削除であっても）
■登録図形を抹消
構文＝
＜図形ＩＤ＞を 登録図形を抹消 → ・
なお、図形を削除した場合は検索対象から自動的に抹消されるので明に抹消する必要はありません。
検出データ
■検出データ型という型紙について
構文＝
（この型紙はライブラリ内に定義済みです） 検出データ型は 型紙 検出図形数は 変数 ・・・・・・・・ ・・・・・・・・ 全体は 検出図形数と ・・・・・・・・ ・・・・・・・・
■検出データ構造体の宣言
図形の検出からその後処理まですべて１つの処理単語の中で行えるのなら、構造体を局所変数として定義することもできます。
■検出した図形の数を得るには
■検出した図形のＩＤを得るには
構文＝
＜検出データ構造体＞の ＜位置＞での 指定位置の検出図形を得る → 図形ＩＤ
位置は１から始まる整数ですが、特別に負数を指定することもできます。その場合、末尾から数えた位置という扱いとなります。たとえば位置として -1 を指定すると複数図形のうち末尾のものを参照できます。
○○とは タグ１は 図形ＩＤ 検出データは 構造体 検出データ型 （図形の検索） タグ１と １番と (=識別番号) 検出データで このタグを持つ図形群を得て （検出図形の処理） 検出データの 検出図形数を 回数指定し 検出データの 回数での 指定位置の検出図形を得て ・・何らかの処理し・・ 繰り返し
■複数の検出図形のうち１つだけ得るには
複数の図形が重なっている個所を座標指定した場合は複数の図形が検出されます。このうち１つだけの図形を扱いたい場合に推奨するのが”最も手前にある”図形を使うことです。たとえば座標位置にある図形を削除する場合など、最も手前の１つを対象とするのは納得できるからです。
次のようにしてください。
／￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣＼ 検出データは 構造体 検出データ型 検出データの −１の 指定位置の検出図形を得て ・・・ ＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿／上記プログラムは検出された図形群の最後の要素をアクセスしています。
図形群の検出は描画された順序となるため、末尾要素が最も手前の図形となります （レイヤを操作していなければという前提であり、レイヤを操作している場合は末尾図形が最も手前とはならないこともあります）。
図形検出をおこなう処理単語
■このタグを持つ図形群を得る
構文＝
＜タグＩＤ＞と ＜識別番号＞と ＜検出データ構造体＞で このタグを持つ図形群を得る → ・ 注１：識別番号は１から始まる整数（１〜４を指定） 注２：あらかじめ検出対象としたい図形を登録しておく 必要があります。図形の登録 を参照ください。
識別番号は１から４までの整数を指定してください。通常は１を指定すれば良いですが、図形検出にともなう処理が続いている間にさらに別の図形検出をおこなう場合 （２種類の図形検出が重複する場合） は、後者は２など別の識別番号を使います。
プログラム例：
○○とは タグ１は 図形ＩＤ 検出データは 構造体 検出データ型 （図形の検索） タグ１と １番と (=識別番号) 検出データで このタグを持つ図形群を得て （検出図形の処理） 検出データの 検出図形数を 回数指定し 検出データの 回数での 指定位置の検出図形を得て ・・何らかの処理し・・ 繰り返し
■図形に含まれるタグ群を得る
構文＝
＜図形ＩＤ＞と ＜検出データ構造体＞で 図形に含まれるタグ群を得る → ・ 注：あらかじめ検出対象としたい図形を登録しておく 必要があります。図形の登録 を参照ください。
指定した図形に付与されているタグ群を調べます（１つの図形に複数のタグが付与されていることもあります）。
○○とは タグ１は 図形ＩＤ 検出データは 構造体 検出データ型 （図形の検索） タグ１と １番と (=識別番号) 検出データで 図形に含まれるタグ群を得て （検出タグの処理） 検出データの 検出図形数を 回数指定し 検出データの 回数での 指定位置の検出図形を得て ・・何らかの処理し・・ 繰り返し
円２（左の赤円）には現在、「二つ円」というタグと「選択タグ」の２種類のタグがが付与されているため、それら２つのタグの図形がダンプされます。
■タグを持つ図形群にこの図形が含まれる？
構文＝
＜タグＩＤ＞にたいし ＜図形ＩＤ＞が タグを持つ図形群にこの図形が含まれる？ → 真偽 注：図形の登録は不要です
○○とは
タグ１は 図形ＩＤ
図形１は 図形ＩＤ
タグ１にたいして
図形１が
タグを持つ図形群にこの図形が含まれる？
ならば ・・・・
つぎに
この機能は図形登録と無関係に処理されます。
■座標近傍の図形群を得る
構文＝
＜キャンバスＩＤ＞と ＜Ｘ座標＞と ＜Ｙ座標＞と ＜許容値＞と ＜識別番号＞と ＜検出データ構造体＞で 座標近傍の図形群を得る → ・ 注：許容値としてシンボル「標準許容値」が使えます (このシンボルの値は3です) 注：あらかじめ検出対象としたい図形を登録しておく 必要があります。図形の登録 を参照ください。
キャンバスは ＩＤ。
○○とは
検出データは 構造体 検出データ型
キャンバスと
Ｘと Ｙと
標準許容値と
１番と 検出データで
座標近傍の図形群を得て
（マウスイベントでは必ず座標が伝達されます）
- 注
- 線画（直線や塗りつぶさない円など）は許容値が小さいと本当に線の上をクリックしないとヒットしません。塗りつぶしのある図形は図形内のどこをクリックしてもヒットします
許容値として整数を記述する代わりに「標準許容値」というシンボルを使うこともできます。これはデフォルト値で数値 ３ です。たとえば８を指定すれば標準より広い範囲でヒットします。
■座標近傍の図形を一つ得る
構文＝
＜キャンバスＩＤ＞と ＜Ｘ座標＞と ＜Ｙ座標＞と ＜許容値＞で 座標近傍の図形を一つ得る → 図形ＩＤ 注：許容値としてシンボル「標準許容値」が使えます (このシンボルの値は3です) 注：図形の登録は不要です
キャンバスは ＩＤ。
○○とは
発見図形は 図形ＩＤ
キャンバスと
Ｘと Ｙと
標準許容値で
座標近傍の図形を一つ得て 発見図形に 入れ
発見図形が ゼロ以外
ならば ※ 発見した ※
・・何らかの処理し・・
つぎに
１つの図形ＩＤを返せば良いため、検出データという構造体は使用せず、単に図形ＩＤをスタックに積んで戻って来ます。
ヒットしなかった場合、ID=0 となるのでそれで判定してください。
図形の選択
図形選択は本来、ライブラリ機能と言うよりは、アプリケーション寄りの機能であると言えます。実際、本ライブラリが使っているGUIエンジンに図形選択の機構は無く、ライブラリ内で構築したものです。・図形を選択したときのユーザへのフィードバックがさまざま考えられる
→本ライブラリでは選択された図形の枠線を太くしますがアプリケーションによってはそれ以外の方法をとりたいかも知れません
本ライブラリは最低限の図形選択の機能を提供するものであり、「このような機能でよかったらお使いください」というものであることをご承知願います。もちろんユーザが別途プログラムを組むことによって独自の図形選択を構築することは可能です。
■図形選択を利用する前提
- 選択対象となる図形については、あらかじめ 図形の登録 で解説する図形の登録を済ませておく必要があります。
- 選択のトリガは、サンプル "canvas-event.exe" においてはマウス左クリックで行いますが、他の事象をトリガとしても構いません 。
- ただ１つの図形選択、複数選択いずれも対応できますがサンプルプログラムでは複数選択の方法によっています。アプリケーションによっては、たとえば最初の選択は「左クリック」で、後続する選択追加は「Ctrl-左クリック」でおこなうようにしたいかも知れませんがそれはアプリケーション側のことなので可能です。
- 「図形が選択状態にある」は、内部的には「選択タグ」と呼ぶタグがその図形に付与されることで実現しています。したがって、たとえば選択されている図形をすべて削除するには、その「選択タグ」を指示して図形の削除を行うことで実現できます
選択タグは 選択タグレコード数の 図形ＩＤ。
選択タグへのデータ書き込みはライブラリが自動的に行いますが、グローバルなシンボルなのでユーザがアクセスすることもできます。
しかしそれ以外で選択タグか無用になった場合、たとえば選択された図形群をすべて削除した時・・などはユーザが明に選択タグの変数をクリアしてください。（サンプルプログラム "canvas-event.exe" はそのようにしています）
■選択を開始
構文＝
＜キャンバスＩＤ＞を 選択を開始 → ・
キャンバスは ＩＤ。 ○○とは 〜略〜 キャンバスを 選択を開始する 〜略〜
■選択管理番号を得る
構文＝
＜キャンバスＩＤ＞で 選択管理番号を得る → 管理番号
キャンバスは ＩＤ。 ○○とは 管理番号は 変数 キャンバスで 選択管理番号を得て 管理番号に 入れ （タグが有効か検査） 選択タグ（管理番号）が ゼロ？ ならば 終り つぎに （タグを使う） 選択タグ（管理番号）を ・・・・し
■この図形の選択状態を反転
構文＝
＜キャンバスＩＤ＞と ＜図形ＩＤ＞で この図形の選択状態を反転 → 新しい選択状態 ”新しい選択状態”は真偽値（整数）です
off→on の場合、図形に選択タグを付与し、さらに図形の枠線を太くすることでアプリの利用者に視覚的なフィードバックを行います。
on→off の場合はその逆で、選択タグを図形から取り除き、太くした枠線を元に戻します。
この処理単語は戻るときに新しい選択状態を返してきます。
※−−−−−−−−−−−−−−−− ※ 旧太さ 新太さ ※−−−−−−−−−−−−−−−− ※ ８まで ４を加算 ※ ２０まで (旧×0.3 + 4)を加算 ※ ２０超 (旧×0.2 + 4)を加算 ※−−−−−−−−−−−−−−−−
■この図形は選択中？
構文＝
＜図形ＩＤ＞が この図形は選択中？ → 真偽
■すべての図形の選択状態を解除
構文＝
＜キャンバスＩＤ＞を すべての図形の選択状態を解除 → ・
「この図形の選択状態を反転」を別の図形に対して適用することで複数の図形を選択することができますが、そうではなく、ただ１つだけの図形のみが選択できる・・つまり別の図形を選択したなら前の選択を解除し、結果的に１つだけの図形が選択される・・ようにするために本機能が使えます。
その目的で使うには、
2. この図形の選択状態を反転
■選択された図形群を操作するには
キャンバスは ＩＤ。 ○○とは 管理番号は 変数 キャンバスで 選択管理番号を得て 管理番号に 入れ （タグが有効か検査） 選択タグ（管理番号）が ゼロ？ ならば 終り つぎに （タグを使い図形操作） 選択タグ（管理番号）を 図形を削除し 選択タグ（管理番号）を クリアし
処理の最後に選択タグのクリアをおこなっている点に注目してください。図形を削除してしまったので選択状態は意味がなくたったため念のためクリアをかけています。
キャンバスは ＩＤ。 ○○とは 管理番号は 変数 キャンバスで 選択管理番号を得て 管理番号に 入れ （タグが有効か検査） 選択タグ（管理番号）が ゼロ？ ならば 終り つぎに （タグを使い図形操作） 選択タグ（管理番号）と 移動量Ｘと 移動量Ｙで 図形を移動し
図形は移動したものの、選択状態はまだ維持されているため、選択タグはクリアしていません。
■選択図形をダンプ
構文＝
＜キャンバスＩＤ＞を 選択図形をダンプ → ・
現在選択されている図形群のＩＤをコンソールにダンプします。
あらかじめ「コンソールを開き」を実行しておく必要があります。
図形が存在するか調べる
■図形存在？
構文＝
＜図形ＩＤ＞が 図形存在？ → 真偽
図形タグには適用できません。
図形イベントのバインド
以前の 「メニューバー」−「バインドの概念」 の解説が本項の機能を理解するのに必要になりますので合わせてお読みください。
■図形イベントのバインドを登録
構文＝
（ステップ１：登録時） ↓イベント処理語の実行情報 ＜イベント名＞と ＜実行情報＞と ＜引数＞を ＜図形ＩＤ＞に 図形イベントのバインドを登録 → ・ （ステップ２：イベント発生時に渡されるパラメータ） ↓登録時の引数が空列のとき スタック→ イベント名、Ｘ座標列、Ｙ座標列、３(引数個数) ↓登録時の引数が１つのとき スタック→ イベント名、Ｘ座標列、Ｙ座標列、ユーザ引数、４(引数個数) ↓登録時の引数が２つのとき スタック→ イベント名、Ｘ座標列、Ｙ座標列、ユーザ引数1、ユーザ引数2、５(引数個数) 注：Ｘ座標、Ｙ座標は、整数値ではなく整数を表す文字列です プログラムによって整数値に変換してから使ってください。
正方形クリックのイベント処理とは （引数，引数、・・、引数個数 → ・） ・・すること。 正方形にバインドを登録とは （・ → ・） 正方形１は 図形ＩＤ 〜略〜 左クリックと ←イベント名 正方形クリックのイベント処理の 実行情報と ←実行情報 「abc "def"」と ←イベント引数 正方形１で ←図形ＩＤ 図形イベントのバインドを登録する。
イベント名のほか、イベント発生時に呼び出すべき処理単語の実行情報および、引数を指定します。
もし引数を与える必要が無ければ、
／￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣＼ 正方形クリックのイベント処理の 実行情報と 空列と ←★ 正方形１で 図形イベントのバインドを登録する ＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿／のように書いて空列を渡してください。
引数を与える場合は文字列定数として、
「abc」を ・・
のように指定します。複数の引数は
「abc def」を ・・
のように空白で区切って並べてください。引数に空白文字を含む場合には
「"ab c" def」を ・・
のように指定してください。
なお、引数（群）文字列末尾に \ 記号は付けられません。また、{ } 記号は使えるものの、開きと閉じでバランスが取れている必要があります。（アンバランスで使うとエラーを検出します）
図形がクリックされるための条件ですが、線分や円弧など、線だけから成る図形は要注意です。本当に線の真上をクリックしないと反応しないので操作性が悪くなります。
対策として以下の方法も検討してください。
（１） 円や長方形など、閉じている図形の場合、あえて
キャンバスの背景色で塗りつぶす
→見た目の変化はありませんが図形内部をクリックすることでも反応できます
（２） 図形をバインドせず、「座標近傍の図形を一つ得る」を使う
→線の真上でなくても反応できるようになります
クリックした個所に複数の座標が存在する場合、最も手前にある図形が反応します。
バインド登録時の引数が２つの場合、イベント処理語が起動された段階で以下ようなスタック並びとなります。
登録時の引数が２つのとき
→ イベント名、Ｘ座標列、Ｙ座標列、ユーザ引数1、ユーザ引数2、５(引数個数)
ユーザ引数は２個なのですが、イベント引数全体としては５個積まれて来ることに注意が必要です。奥から４番目のイベント引数がユーザ引数１となります。また、Ｘ座標とＹ座標については整数ではなく、整数を表す文字列であることも注意します（イベント引数はすべて文字列です）。
イベント処理語の定義例を示します（ユーザ引数が２個の場合）。
プログラム例：
正方形クリックのイベント処理とは （イベント名、Ｘ座標列、Ｙ座標列、ユーザ引数1、ユーザ引数2、 ５ → ・） イベント名は 文字列 Ｘ座標列は 文字列 Ｙ座標列は 文字列 引数１は 文字列 引数２は 文字列 Ｘ座標は 変数 Ｙ座標は 変数 （パラメータ数が） ５に 等しい でなければ 「正方形クリックのイベント処理でのパラメータ数異常」で 重大エラー つぎに イベント名と Ｘ座標列と Ｙ座標列と 引数１と 引数２に 入れ Ｘ座標列を 数値変換し 捨て Ｘ座標に 入れ Ｙ座標列を 数値変換し 捨て Ｙ座標に 入れ ・・・・・・・・ 。
■図形イベントのバインドを抹消
構文＝
＜イベント名＞ ＜図形ＩＤ＞で 図形イベントのバインドを抹消 → ・
正方形のバインドを抹消とは （・ → ・） 左クリックと 正方形１で 図形イベントのバインドを抹消する
■図形としてボタンを描画している場合
（サンプルプログラム "canvas-event.exe" にもキャンバス内ボタンがありますが、そのようにしています）
○○とは
キャンバスで ボタンのＩＤを取得し ボタン１に 入れ
「ボタン」を ボタン１に テキストを設定し
ボタン押下処理の 実行情報を ボタン１に イベント処理を登録し ←★
ボタン１を 有効化し
キャンバスで ボタン１を 150 380で 図形としてウィジェットのＩＤを取得し
ボタンの図形に 入れ
ボタンの図形を 描画し
ポップアップメニュー(キャンバス)
重複しますが要点のみ解説します。詳細は 「テキストウィジェット」−「ポップアップメニュー」 を参照してください。
■ポップアップメニューを準備
構文＝
＜キャンバスＩＤ＞で ポップアップメニューを準備 → メニューＩＤ
■メニュー項目としてボタンを追加
構文＝
（ステップ１：ボタンの登録） ＜メニューＩＤ＞と ＜テキスト＞と ＜実行情報＞と ＜引数＞で メニュー項目としてボタンを追加 → ・ （ステップ２：イベント発生時に渡されるパラメータ） ↓登録時の引数が空列のときはゼロのみ渡される スタック→ ０(引数個数) ↓登録時の引数が非空列のとき スタック→ 引数１，引数２，・・、 ｎ(引数個数) ↑ 引数が1個ならｎ=1
■ポップアップメニューのイベント処理でのマウス位置の参照
もしマウス座標が必要であれば次の処理単語を使って参照してください。
構文＝
ポップアップ時のマウス位置を得る → Ｘ座標、Ｙ座標 注：座標はキャンバス左上隅を0,0とするものです
■ポップアップメニューとマウス右クリックイベントとの競合
もしマウス右クリックを「マウスイベントのバインドを登録」によってバインドした場合、ポップアップメニューを出そうとしてマウスを右クリックすると、
2. ポップアップが表示される
したがってポップアップメニューを使うのであれば、マウス右クリックはバインドしないでください。
キャンバスの出力
■キャンバス全体をイメージとして得る
−「イメージの出力」
−「イメージをファイルに出力」
構文＝
（ステップ１） ＜キャンバスＩＤ＞を ウィジェットのイメージを取得 → イメージＩＤ （ステップ２） ＜イメージＩＤ＞を ＜フォーマット＞と ＜ファイル名＞で イメージをファイルに出力 → ・ フォーマットとして以下のいずれかの文字列を与える "gif" "jpeg" "png" "bmp"
ステップ２はメモリに保存したイメージデータをファイルとして出力する手続きとなります。
以下はプログラム例です。
○○とは キャンバスイメージは ＩＤ キャンバスの ウィジェットのイメージを取得し キャンバスイメージに 入れ キャンバスイメージを "png"と "c:\temp\canvas.png"で イメージをファイルに出力
図形の描画 − 円を一つ表示 − 円を二つ表示した後、同じくメニューバーの、
その他の操作 − キャンバスをイメージファイルに出力をおこなってください。ダイアログで出力ファイル名を尋ねて来るので、出力先ファイル名を入力してください。（例：c:\temp\canvas.png）
■キャンバスを印刷データ（psファイル）として出力
一般的に印刷用紙の解像度はディスプレイの解像度より高いことが多く、イメージデータを印刷すると粗く見えてしまうことがありますが、最初から印刷用の出力をおこなうときれいに印刷できることが多いです。
- 注
- PostScriptは単なるデータではなくスクリプトです。
ps対応プリンタはこれをプログラムとして解読・実行することで印刷をおこないます。
MindはFORTHと呼ぶプログラム言語が動作原理になっていますが上位概念としてはスタック指向言語です。
偶然にもPostScriptはスタック指向のプログラム言語です。
構文＝
＜キャンバスＩＤ＞と ＜出力ファイル名＞と ＜カラー指定＞で キャンバスを印刷ファイルに出力 → ・ 注：出力ファイル名の拡張子は .ps f必須です 注：カラー指定は次のいずれかのシンボルを指定します カラー出力 グレー出力 グレイ出力 モノクロ出力
キャンバスを "c:\temp\canvas.ps"と カラー出力で キャンバスを印刷ファイルに出力する
図形の描画 − 基本作画した後、同じくメニューバーの、
その他の操作 − キャンバスを印刷ファイルに出力をおこなってください。ダイアログで出力ファイル名を尋ねて来るので、出力先ファイル名を入力してください。そこで c:\temp\canvas.ps を入力したと仮定すると、次のようなファイルが生成されます。
c:\temp\canvas.ps
■印刷データ（psファイル）をPDFに変換
- 注
- この機能はサードパーティが提供する別のソフトウェア "Ghostscript" を利用します。本GUIライブラリはそれを利用する手段を提供するものの確実な動作を保証するものではありませんので業務用にお使いの場合にはその点をご留意願います。
- 注
- PDFへの変換時にGhostscriptが起動する際にわずかな間、Ghostscriptのウィンドウが開くことがありますがそのような仕様としてご了承ください。
- 注
- ** Windows 10 以上の環境でのみ利用できます **
GhostscriptのPCへの設置は既に終わっているとしその先の手順を解説します。
（Ghostscriptのインストール方法はこの先の解説 Ghostscriptのインストール を参照してください）
構文＝
↓出力ファイル名は空列でも可 ＜psファイル名＞を ＜PDFファイル名＞に 印刷ファイルをPDFに変換 → ・ 注：psファイル名の拡張子は .ps 必須です 注：PDFファイル名の拡張子は .pdf 必須です 注：PDFファイル名として空列を指定すると psファイル名の拡張子をpdfに置換した ファイル名として自動計算します
"c:\temp\canvas.ps"を "c:\temp\canvas.pdf"に 印刷ファイルをPDFに変換する
図形の描画 − 基本作画した後、同じくメニューバーの、
その他の操作 − 印刷ファイルをPDFに変換をおこなってください。ダイアログで印刷ファイル名を尋ねて来るので先の実験で出力したpsファイル名を入力してください。たとえば c:\temp\canvas.ps を入力したと仮定すると次のファイルが生成されます。
c:\temp\canvas.pdf
■キャンバスをPDFファイルとして出力
- 注
- Ghostscriptに関する注意書きは前項の 印刷データ（psファイル）をPDFに変換する の記述と同じになります。そちらをご参照ください
構文＝
＜キャンバスＩＤ＞と ＜出力ファイル名＞と ＜カラー指定＞で キャンバスをPDFに出力 → ・ 出力ファイル名の拡張子は .pdf 必須です カラー指定は次のいずれかのシンボルを指定します カラー出力 グレー出力 グレイ出力 モノクロ出力
キャンバスを "c:\temp\canvas.pdf"と カラー出力で キャンバスをPDFに出力する
プログラム例は "canvas-extension.src" をお読みください。
記： 指定したpdfと同じ主ファイル名で拡張子.psを持つファイルが臨時に生成されることをご承知ください。
座標計算ツールの使い方
calcmove.mco
描画した図形の位置を少しずらしたい場合、ソースコード内の座標値を訂正する必要があるのですが、その際の計算を容易にするものです。
単純起動するとUsageを表示してきます。
／￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣＼ >calcmove Usgae: calcmove MODX MODY num1 num2 num3 .. MODX, MODY 移動量を+/-を頭に付け指定します XまたはYの片方が移動無しの場合 は +0 を指定してください 符号が無い場合は絶対値として解釈 します。たとえば、直線の端点を新 しい絶対値として指定し、別の端点 の予想座標を計算させるのに使えます） num1 num2 num3 .. 複数の座標を並て書きます （奇数でも構いません） ＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿／たとえば、
／￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣＼ <-移動量-> <---元の座標---> >calcmove +30 +0 218 18 368 68 248 18 398 68 ←この新しい座標をソースコードにコピー・ペーストして使う ＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿／座標値を手計算するのは大変ですが本プログラムを使うことで作業が軽減されます。上記例では相対値を指示していますが、絶対値で指定することもでき、その場合は先頭の座標に対しての指示とされ、他の点の座標も連動して計算されます。
Ghostscriptのインストール
- 注
- サードパーティが提供するソフトウェア "Ghostscript" をMindから利用することについて、本GUIライブラリはその確実な動作を保証するものではありません。業務用にお使いの場合にはその点をご留意願います。
（** Windows 10 以上の環境でのみ利用できます **）
Ghostscript : Downloads https://www.ghostscript.com/releases/gsdnld.html上記のWebページから、
↓ダウンロード時期によりここの番号が変わることがあります
Ghostscript 10.04.0 for Windows (64 bit)
→ Ghostscript AGPL Release
というリンクをクリックしてダウンロードしてください。次にダウンロード先の、
gs10040w64.exe ←ダウンロード時期により番号が変わることがあります
をダブルクリックしてインストーラを起動します。イントールが終るとWindows OS にPATHが追加されており、重要： 重要：
インストール先を尋ねられますが、デフォルトの場所ではなく、ディレクトリを明示してください。（デフォルトのディレクトリは空白を含んでしまうため）
たとえば弊社では、C:\myprogというフォルダを指定しました。この場合、C:\myprog\gs\gs10.04.0 ←ダウンロード時期により番号が変わることがあります（以下同様なので略します）のようなディレクトリ内にインストールされます。
Ghostscriptのプログラムを引数無しで起動してみます。カレントディレクトリは安全のため c:\temp のようなところにしてきおきます。
／￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣＼ >cd c:\temp >gswin64c ・・・ ・・・ ←コピーライトなどが表示されれば起動しています ・・・ GS> ←Ctrl-C打鍵で終了してください ＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿／次に、カレントディレクトリ上（たとえば c:\temp）に、先のマニュアル個所、
でおこなったサンプルプログラム実行で得たpsファイルの複製（たとえば canvas.ps）を置き、次のようにコマンドを実行してください。＜既解説＞
・・サンプルプログラム "canvas-basic.exe" を使い、キャンバスのファイルへの出力を試してみてください。・・
／￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣＼
↓ブラウザ上は改行されていますが１行でこの通りに入力してください
>gswin64c -q -dNOPAUSE -dBATCH -o canvas.pdf -sDEVICE=pdfwrite
-sPAPERSIZE=a4 -dFIXEDMEDIA -f canvas.ps
＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿／
上記は、 canvas.ps を入力ファイルとし、canvas.pdf を出力ファイルとしてPDF変換を指示するものです。何も表示されずにプロンプトに戻ってくれば正しく動作しています。次のファイルが生成されているはずです。Acrobatなどのアプリケーションで開いてみてください。
c:\temp\
canvas.pdf ←生成されたファイル
- 注
- 一般的に印刷用紙の解像度はディスプレイの解像度より高いことが多くキャンバスを素直に印刷データとして出力すると小さく印刷されることが多くなります。そのようなものとご理解ください。
次に、Mind 9 のインストールディレクトリの bin\ にある次のファイルをエディタで開きます。
pmind\bin\ ghostpath.txt上記テキストファイルには以下の内容が記入されています。
／￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣＼ ↓ここを開発者の環境に合わせて訂正 ←−−−→ C:\myprog\gs\gs10.04.0\bin\gswin64c.exe -q -dNOPAUSE -dBATCH -sDEVICE=pdfwrite -sPAPERSIZE=a4 -dFIXEDMEDIA （ブラウザの都合で２行に見えますが実際は１行です） ＼＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿／上記「←−−→」の個所を開発者の環境に合わせて修正してセーブしてください。
最後に、印刷データ（psファイル）をPDFに変換する のセクションで解説したサンプルプログラムの実行例に従ってPDFへの変換を試してください。
