1

マウスオーバーで目印の画像を変更しようとしています。マウスオーバー イベント ハンドラは次のとおりです。

function changePlacemark(e){
    e.preventDefault();
    this.getStyleSelector().getIconStyle().getIcon().setHref('myImageURL');
}

問題は、関数を実行すると実際に画像が変更されることですが、目印が完全にリセットされ、あたかも新しい目印が地図に追加されたかのようにズーム アニメーションが最初からやり直されることです。

これを防ぐ方法はありますか？目印をリセットするのではなく、画像を変更するだけです。一種の経験を台無しにします。

4

1 に答える 1

2

もちろん、スタイルを使用して、KML または API 経由でロールオーバー アイコンを作成できます。アイコンの href 属性を更新するのではなく、機能のスタイルを設定するだけで済みます。

API で:

  var style = ge.createStyle("");
  style.getIconStyle().getIcon().setHref('myImageURL');
  feature.setStyleSelector(style);

Kml で:

  <Document>
    <Style id="highlightPlacemark">
      <IconStyle>
        <Icon>
          <href>http://maps.google.com/mapfiles/kml/paddle/red-stars.png</href>
        </Icon>
      </IconStyle>
    </Style>
    <Style id="normalPlacemark">
      <IconStyle>
        <Icon>
          <href>http://maps.google.com/mapfiles/kml/paddle/wht-blank.png</href>
        </Icon>
      </IconStyle>
    </Style>
    <StyleMap id="exampleStyleMap">
      <Pair>
        <key>normal</key>
        <styleUrl>#normalPlacemark</styleUrl>
      </Pair>
      <Pair>
        <key>highlight</key>
        <styleUrl>#highlightPlacemark</styleUrl>
      </Pair>
    </StyleMap>
    <Placemark>
      <name>Roll over this icon</name>
      <styleUrl>#exampleStyleMap</styleUrl>
      <Point>
        <coordinates>-122.0856545755255,37.42243077405461,0</coordinates>
      </Point>
    </Placemark>
  </Document>
于 2013-12-17T10:23:24.387 に答える