ArcGIS JS API 3.21 InfoTemplate 放大按钮答案

【问题标题】：ArcGIS JS API 3.21 InfoTemplate ZoomIn ButtonArcGIS JS API 3.21 InfoTemplate 放大按钮
【发布时间】：2018-01-15 05:46:49
【问题描述】：

有没有人幸运地将点击事件附加到在 InfoTemplate 的 HTML 中构建的自定义按钮？这是我的 InfoTemplate HTML：

uploadInfoTemplate = new InfoTemplate ({
    title: "",
    content: "<strong>Segment:</strong> ${segment}" +
             "<hr/>" +
             "<strong>Time:</strong> <i>${dateTime}</i>" +
             "<div style='width: 100%; text-align:right;'>" +
                 "<input class='zoomButton' type='button' value='Zoom to' />" +
             "</div>"
});

然后我在默认 InfoTemplate 上隐藏了项目，即 zoomTo 链接。我想简单地用一个按钮替换 zoomTo 的功能，让它看起来更好一点。

【问题讨论】：

标签： gis arcgis arcgis-js-api

【解决方案1】：

如果您只想改善“缩放至”按钮的外观，几行 CSS 就可以解决问题：

a.action.zoomTo {
  color: #fff;
  text-decoration: none;
  background-color: #a8abaf;
  border: solid #a8abaf;
  border-radius: 5px;
}
    a.action.zoomTo:hover{
      background-color: #898b8e;
      border: solid #898b8e;
    }

【讨论】：

【解决方案2】：

我很抱歉@Jeremy Swagger，

我忘了我已经解决了这个问题，也忘了更新我的问题。我想出了这样的解决方案：

if(this.zoomButton) {
    domConstruct.destroy(this.zoomButton);
{

var zoomToButtonHTML = '<div style="width 100%;"><input class="zoomButton" type="button" value="Zoom to" /></div>';

this.zoomButton = domConstruct.create("div", {
    "class": "action",
    "id": "uploadLink",
    "innerHTML": zoomToButtonHTML
}, query(".actionList, this.map.infoWindow.domNode)[0]);

var self=this;
on(this.zoomButton, 'click', function(evt) {
    self._zoomToPoint(evt. self.map);
});

CSS 为：

.zoomButton {
    background: linear-gradient(#666666, #3F4041);
    color: #ffffff;
    border: 1px solid #000000;
    border-radius: 0,2em;
}

.zoomButton:hover {
    background: #333333;
}

【讨论】：