Question

所以我一直在使用Google Earth API并尝试在鼠标悬停时更改地点标记的图像。

我想使用flag-sprites来减少负载，但我在编写语法时遇到了麻烦。如果我将它直接放入HTML文件中，则用法非常简单。例如：

<img src="blank.gif" class="flag flag-cz" alt="Czech Republic" />

但是当把它放到我的javascript文件中时，我有点迷失了。这是我的代码：

  var placemark = ge.createPlacemark('');
  placemark.setName(country.name);
  ge.getFeatures().appendChild(placemark);

  google.earth.addEventListener(placemark, "mouseover", function(event){
    placemark.setAttribute("class", "flag flag-cz");
    placemark.setAttribute("alt", "Czech Republic");
    placemark.setAttribute("src", "blank.gif");
  });

我也尝试使用highlightIcon技术，但“setAttribute”方法会破坏代码（因为highlightIcon是一种不同于地标的变量类型）：

    //Create highlight style for style map.
    var highlightStyle = ge.createStyle('');
    var highlightIcon = ge.createIcon('');
    highlightIcon.setHref('http://google-maps-icons.googlecode.com/files/world.png');

    highlightIcon.setAttribute("class", "flag flag-cz");
    highlightIcon.setAttribute("alt", "Czech Republic");
    highlightIcon.setAttribute("src", "blank.gif");

    highlightStyle.getIconStyle().setIcon(highlightIcon);
    highlightStyle.getIconStyle().setScale(15.0);

Answer 1

你可以实现你想要的而不是CSS，因为GE Plugin生活在一个不同的领域。

首先将精灵定义为地标图标，然后必须在X和Y轴上明确设置其偏移。类似的东西：

var icon = window.ge.createIcon('');
icon.setHref("http://opengameart.org/sites/default/files/styles/watermarked/public/last-guardian-sprites_0.png");

// Set the size of the ICON - according to the dimension on the sprite
icon.setW(50);
icon.setH(50);

// Set its offset
icon.setX(10);
icon.setY(50);

var placemark = ge.createPlacemark('');

var style = ge.createStyle(''); //create a new style
style.getIconStyle().setIcon(icon); //apply the icon to the style
placemark.setStyleSelector(style); //apply the style to the placemark

// Set the placemark's location.  
var point = ge.createPoint('');
point.setLatitude(window.lat);
point.setLongitude(window.lon);
placemark.setGeometry(point);
window.ge.getFeatures().appendChild(placemark);

Y轴也从图像的左下角开始。

为了使用标记精灵，您必须在代码中重新映射每个国家/地区标志的所有偏移（x，y），并在加载地标时使用这些偏移。

以下是KmlIcon的参考：https://developers.google.com/earth/documentation/reference/interface_kml_icon

在Google地球中使用Flag Sprites

1 个答案: