1. 変数を使用する

まずは，以下の実験プログラムファイルをダウンロードしてください。このプログラムを修正して，実験を作成していきます。

osg-simple-script-demo2-2020-05-19--22 47.study.json

Zip

osg-simple-script-demo2-2020-05-19--22 47.study.json.zip

上記の方法で保存できない場合のヒント

デモのプログラムがダウンロードできない

最初の状態では，以下のように「緑の円」を画面の中心に１つ描くプログラムです。

// Circle
  this.options.content.push({
    //共通パラメータ
    type: 'circle', 
    left: 0,top: 0, 
    width:100, height:100,
    fill:null,stroke:'green', // nullまたは'red' 'rgb(X,X,X)'
    strokeWidth:'5',
    angle: 0
  })

それでは，まずは変数を使用して緑の円を描く位置を変えられるようにしましょう。以下のように，まずは変数「xloc」を作成し，値を「300」にします。

次に，プロパティ「left」の値に「xloc」を指定します。

var xloc = 300;

// Circle
  this.options.content.push({
    //共通パラメータ
    type: 'circle', 
    left: xloc,top: 0, 
    width:100, height:100,
    fill:null,stroke:'green', // nullまたは'red' 'rgb(X,X,X)'
    strokeWidth:'5',
    angle: 0
  })

実行をすると，円が少し右にズレて表示されます。

次は，配列を使ってみましょう。以下のように配列を作成し，代入してください。配列は「0」から開始されるので，以下の例では「-300」が代入されます。