2

ユーザーが 3 つの単純な HTML ラジオ ボタンを使用してビューを選択できるインターフェイスを作成しようとしています。プラグインを適切なビュー (デフォルトとして選択するラジオ ボタンによって決定) で初期化することができましたが、別のラジオ ボタンを選択しても何も起こりません。関連するコードは次のとおりです。

document.getElementById('ui').innerHTML =
'<div>' +
'<h2>Select View:</h2>' +
'<input type="radio" name="view" value="valley" id="valley" onclick="ge.getView().setAbstractView(\'valleyview\');"/ checked> Full Valley<br/>' +
'<input type="radio" name="view" value="takten" id="takten" onclick="ge.getView().setAbstractView(\'taktenview\');"/> Takten Ling Monastery<br/>' +
'<input type="radio" name="view" value="stupa" id="stupa" onclick="ge.getView().setAbstractView(\'stupaview\');"/> Jonang Stupa<br/>' +
'</div>' +
'<br/>';

  }

  function initCallback(instance) {
ge = instance;
ge.getWindow().setVisibility(true);

// add a navigation control
ge.getNavigationControl().setVisibility(ge.VISIBILITY_AUTO);

// add some layers
ge.getLayerRoot().enableLayerById(ge.LAYER_BORDERS, false);
ge.getLayerRoot().enableLayerById(ge.LAYER_ROADS, false);

var la = ge.createLookAt('');

if(document.getElementById('valley').checked) {
la.set(29.36890346613675, 88.0025304326977,
25, // altitude
ge.ALTITUDE_RELATIVE_TO_GROUND,
180, // heading
60, // straight-down tilt
500 // range (inverse of zoom)
);
   }else if(document.getElementById('takten').checked) {
la.set(30.36890346613675, 88.0025304326977,
25, // altitude
ge.ALTITUDE_RELATIVE_TO_GROUND,
180, // heading
60, // straight-down tilt
500 // range (inverse of zoom)
);
}else if(document.getElementById('stupa').checked) {
la.set(31.36890346613675, 88.0025304326977,
25, // altitude
ge.ALTITUDE_RELATIVE_TO_GROUND,
180, // heading
60, // straight-down tilt
500 // range (inverse of zoom)
);
}
    ge.getView().setAbstractView(la);    

var valleyview = ge.createLookAt('');
  valleyview.set(29.36890346613675, 88.0025304326977,
25, // altitude
ge.ALTITUDE_RELATIVE_TO_GROUND,
180, // heading
60, // straight-down tilt
500 // range (inverse of zoom)
);

   var taktenview = ge.createLookAt('');
  taktenview.set(30.36890346613675, 88.0025304326977,
25, // altitude
ge.ALTITUDE_RELATIVE_TO_GROUND,
180, // heading
60, // straight-down tilt
500 // range (inverse of zoom)
);

   var stupaview = ge.createLookAt('');
  stupaview.set(31.36890346613675, 88.0025304326977,
25, // altitude
ge.ALTITUDE_RELATIVE_TO_GROUND,
180, // heading
60, // straight-down tilt
500 // range (inverse of zoom)
);

私が間違っているかもしれないことについての指針をいただければ幸いです。ありがとう。

4

1 に答える 1

2

onclick問題は、各ハンドラーのコードです...

onclick="ge.getView().setAbstractView(\'valleyview\');"

メソッドには、またはオブジェクトなどsetAbstractViewから継承するオブジェクトを渡す必要がありますが、文字列値を渡しています。KmlAbstractViewKmlCameraKmlLookAt

これを修正するには、パラメーターを囲む一重引用符を削除するだけです。

onclick="ge.getView().setAbstractView(valleyview);"

また、機能をメソッドにカプセル化して、呼び出しをよりクリーンにします。次のようなもの。

var lookat = function(abstractView) {
  ge.getView().setAbstractView(abstractView);
}

次に、あなたのhtmlは単に...

onclick="lookat(valleyview);"

編集 ：

それを見ると、作成した変数を外部から参照できないため、さまざまなビューを initCallBack 関数の外に移動する必要もあります...

全体として、これを行うためのより良い方法は、ビューの作成方法と設定方法を書き直して、a) 重複をすべて削除し、b) コードをより明確にすることです。次のようなもの。

document.getElementById('ui').innerHTML =
    '<div>' +
    '<h2>Select View:</h2>' +
    '<input type="radio" name="view" value="valley" id="valley" onclick="lookat(29.36890346613675, 88.0025304326977);"/ checked> Full Valley<br/>' +
    '<input type="radio" name="view" value="takten" id="takten" onclick="lookat(30.36890346613675, 88.0025304326977);"/> Takten Ling Monastery<br/>' +
    '<input type="radio" name="view" value="stupa" id="stupa" onclick="lookat(31.36890346613675, 88.0025304326977);"/> Jonang Stupa<br/>' +
    '</div>' +
    '<br/>';

function initCallback(instance) {
    ge = instance;
    ge.getWindow().setVisibility(true);

    // add a navigation control
    ge.getNavigationControl().setVisibility(ge.VISIBILITY_AUTO);

    // add some layers
    ge.getLayerRoot().enableLayerById(ge.LAYER_BORDERS, false);
    ge.getLayerRoot().enableLayerById(ge.LAYER_ROADS, false);

    // only valley can be checked here so no need for the conditional logic.
    lookat(29.36890346613675, 88.0025304326977);
}

var lookat = function(lat, lng) {
    var la = ge.createLookAt('');
    la.set(lat, lng, 25, ge.ALTITUDE_RELATIVE_TO_GROUND, 180, 60, 500);
    ge.getView().setAbstractView(la);    
}
于 2013-01-05T00:51:31.860 に答える