保存されたJSONデータの読み方について

書式

FMキャンバス 3 による描画後、保存されたデータは次のような形で保存されています。

[{図形},{図形},{図形}...]

図形単位に{}でくくられています。

{}の中身は各図形の持つ属性名と属性値を "" でくくった以下のようなペアの繰り返しになります。

{"key1":"value1","key2":"value2","key3","value3"...}

属性値が数値であっても "" でくくられます。

属性

属性（key）の種類には以下のものがあります。

class, cx, cy, rx, ry stroke, stroke-width, d, fill, stroke-opacity, fill-opacity,content, x ,y, font-size

これらの属性名はSVGの各図形が持つ属性名に準じていますが、classについてはFMキャンバス 3 独自の属性です。図形の種類を表します。
また、テキストオブジェクトにおけるcontentもFMキャンバス3独自に実装されたものです。

属性名(key)	解説
class	図形の種類を示す。 free（自由線） rect（四角形） oval（楕円、円） line（直線） arrow（矢印） text（テキスト）
cx,cy	図形が内接する四角形を想定した場合のその中心座標この属性はSVGにおいては通常<circle />や<ellipse />において見られる属性ですが、FMキャンバス 3においては、line, arrowオブジェクト以外のオブジェクト全てにこの属性を与えています。
rx,ry	楕円のX半径、Y半径（ovalオブジェクトのみ）
stroke	線（枠）の色、文字の色
stroke-width	線幅
d	図形のパス（text,ovalオブジェクト以外。パスの見方については後述。）
fill	塗りつぶし色
stroke-opacity	線に半透明の指定がなされた場合"stroke-opacity":"0.5"と表示されます。
fill-opacity	塗りつぶし色に半透明の指定がなされた場合"fill-opacity":"0.5"と表示されます。
content	テキスト内容（textオブジェクトのみ）
x, y	テキスト描画基準位置座標（textオブジェクトのみ）
font-size	フォントサイズ（textオブジェクトのみ）

重要：スケールされる属性とされない属性

座標値は下絵の横幅を100とした時の相対値座標として保存されています。したがって、保存した描画を再度編集表示する場合、その時に表示される下絵の横幅に応じて座標値は再計算されます。
ただし、線幅はスケールされないことにご注意ください。"stroke-width":"1"で保存されていた場合、編集時の下絵の表示サイズが仮に横幅1000であったとしても線幅は"1"のままで表示されます。
また、これに付随して、矢印オブジェクトの矢印部分についてもご注意ください。矢印の大きさは線幅に応じて決定されます。したがって矢印の頭部分もスケールされることはありません。

パス（dプロパティ）の見方

(例)M50,50L75,90L20,80z

スタート地点座標(50,50)　//Mはスタート地点を表す　MoveToコマンド
座標(75,90)に直線を引く //Lは直線を引くことを表す　LineToコマンド
座標(20,80)に直線を引く
z が最後にあった場合はパスを閉じる。（スタート地点に戻って終わり）　closepathコマンド
classがrectのdプロパティは最後にzがつくのに対し、classがfreeのオブジェクトの場合、zはつきません。

注意

Windowsにおいては座標x,yの区切り文字はコンマではなくスペースとなっています。また、各コマンドM,L,zと座標値の間にもスペースが入ります。
(例)M 50 50 L 75 90 L 20 80 z