2010-12-14-01-SVG と UML の話 - 15 - project-enigma

2010-12-14-01-SVG と UML の話 - 15

>> Site top >> weblog >> 月別アーカイブ >> 2010年12月のlog >> 2010-12-14-01-SVG と UML の話 - 15

最終更新日付:2013/12/31 07:35:19


SVG と UML の話 - 15

2010 年 12 月 14 日

では、非コネクタ要素の共通属性の残りを片付けよう。残っているのは event と layer だが、layer 属性は良く考えたらコネクタでも使えるはずだ。

event 属性では、その要素に対するイベント処理を指定する。一番わかり易いのはクリックイベントだろう(というかそれ以外使ったことがない)。指定すべきイベント処理は、script 要素を使って定義しておく必要がある。以下の例では、画像を表示する image 要素にクリック時のイベント処理を追加している。

image
imgfile:sample.png
size:22 22
position:100 100
event:onclick='toggle_visible( evt, "comment_layer" )'

ついでなので script 要素についても簡単に書いておこう。これは他の要素と異なり、ドキュメントの見た目にはなんの変化ももたらさない。そのかわり、これは ECMA スクリプトなど、SVG で使用可能なスクリプトの定義に展開される。上の例で onclick イベントに応じてコールされる toggle_visible は以下のように定義されている。

script
type:text/ecmascript
code:
function toggle_visible( evt, item ) {
    var svgdoc = evt.getTarget( ).getOwnerDocument( );
    var target = svgdoc.getElementById( item );
    if( target != null ) {
        var visible = target.getAttribute( "display" );
        if( visible == "none" )
            target.setAttribute( "display", "inline" );
        else
            target.setAttribute( "display", "none" );
    }
}

つまり、画像 sample.png をクリックするとスクリプト toggle_visible がコールされ、指定された comment_layer なるものの display 値が inline と none の間でトグルされる、ということになる。現状では、このスクリプトを使えるのは event属性からだけだ。

layer 属性は、その要素が属するレイヤーを指定する。レイヤーというのは、大雑把には要素のグループだ。このツールではレイヤーが名前順(定義順だったかな?)に描画され、最後にどのレイヤーにも属していない要素が描画される。そして現時点でのレイヤーの唯一の積極的な用途は、その表示/非表示の状態をトグルすることだ。そして、そのために必要な処理を script 要素で定義し、ボタン画像やテキストリンクを配置してクリックイベントからそのスクリプトを起動する event 属性を書く、というかたちになっている。

event 属性も script要素も、そしてレイヤーも、まだ手探り状態の機能だ。それらを使って何ができ、何ができなければならず、そして何ができなくても良いのか、まだ見えていないし、今後見えてくるかどうかもわからない。現状の自分の使い方を考える限り、あまり発展しない気がするのが正直なところだ。

 

コメント

このページにコメントする

 

このページのタグ

Page tag : 開発

 

 


Copyright(C) 2005-2017 project-enigma.
Generated by CL-PREFAB.