0

このチュートリアルを使用して、GMaps v3 マップにカスタム コントロールを追加し始めました。

https://developers.google.com/maps/documentation/javascript/controls?hl=fr#CustomControls

特に最後の例は、コントロールで状態を保存する方法を示しています。私が持っているのは、コントロール A をクリックすると太字のテキストに変更され、コントロール B が通常のテキストに変更され、B がクリックされるとコントロール A がリセットされるという点で、連携して動作する必要がある 2 つのコントロールです。状態を保存することでこれを実行しようとしていますが、この場合はボタンで「選択された」状態ですが、ボタンセットで選択されていないボタンをリセットし、ボタンのフォントの重みを変更するという点で、次にどこに行くべきかわかりませんなど

簡単に言えば、ネイティブのマップ タイプ セレクター ボタンと同じ動作をするボタンセットを再現しようとしています。

この問題に最もよく取り組む方法に関するチュートリアルや指針はありますか? 上記のリンクされた例のコードを再投稿します。私のプロパティはselected_.

// Define a property to hold the Home state.
CustomControl.prototype.selected_ = null;

// Define setters and getters for this property.
CustomControl.prototype.getSelected = function() {
  return this.selected_;
}

CustomControl.prototype.setSelected = function(selected) {
  this.selected_ = selected;
}

function CustomControl(map, div, selected) {

  // Get the control DIV. We'll attach our control UI to this DIV.
  var controlDiv = div;

  // We set up a variable for the 'this' keyword since we're adding event
  // listeners later and 'this' will be out of scope.
  var control = this;

  // Set the home property upon construction.
  control.selected_ = selected;

  // styling removed //

  // Setup the click event listener
  google.maps.event.addDomListener(setSelectedUI, 'click', function() {
    control.setSelected(true);
  });
}

選択した状態をボタンで保存しようとするとき、これは完全に間違った方法ですか?

4

1 に答える 1

0

(指定された controlPosition で) すべてのコントロールを反復処理し、現在のノードが選択されたノードであるかどうかを比較し、スタイリングを変更することができます。

例 (selectedアクティブなコントロールに className " " を与え、他の各コントロールの className をクリアするため、グローバル スタイルシートを使用してスタイリングを適用できます)

google.maps.event.addDomListener(setSelectedUI, 'click', function() {
        var _this=this;
          map.controls[google.maps.ControlPosition.TOP_RIGHT]
               .forEach(function(node){
            node.className=(node==_this.parentNode)?'selected':''
          });
          /* proceed with  your control-action*/
        });

setSelectedUIコード内に何があるかわかりませんが、リンクされた例addDomListenerと同じ意味を持つ関数のオブジェクトにの 1 番目の引数を設定する必要があります。controlUI

于 2013-01-12T14:02:52.933 に答える