ESRI自定义主页按钮gis javascript

时间:2015-02-04 00:46:50

标签: javascript jquery arcgis arcgis-js-api

总体问题首先请阅读:如何删除SelectedBusStops和SelectedBusRoutes并缩放以映射:用户点击主页按钮时的地图?

这是我想要做的。我有一个JavaScript应用程序,它使用ArcGIS API for JavaScript以及一些Ajax和JQuery。我正在尝试自定义主页按钮或创建自己的主页按钮,这不仅仅是缩放到初始范围。我试着通过创建一个调用函数goHome()的按钮来自己做这个。然后在该功能中,我做了一些事情,比如从列表中删除突出显示的选定路线,然后滚动到路线列表的顶部,并删除当用户点击公交车站显示时间时可能已填充的任何公交车到达时间。到目前为止,除了删除当前突出显示的(选定路线)以及与所选路线相关联的当前总线停靠点然后缩放到我的初始地图范围之外,我已经做了我想做的所有事情。

我试图做一些事情,比如设置我想要修改的要素图层的setDefinitionExpression,但是由于这个函数在我的代码中的位置,它无法看到它们。当我把这个函数放在main函数中时,它给了我ReferenceError:goHome没有定义。所以我把它放在main函数之外,一切都运行到目前为止,但无法弄清楚如何让featureLayers消失。它会给我一个错误说: ReferenceError:未定义selectedBusStops selectedBusStops.setDefinitionExpression(“Route is null”);

当用户点击列表中的路线时,它将进入并设置definitionExpression以仅显示所选路线。像这样:

selectedBusStops.setDefinitionExpression("Route like '%" + routeSlice + "%'");

以下是我的FeatureLayers:**这是我的问题,无法在另一个功能中使用这些。我用'var'声明了这些并使它们在它们所处的函数中是局部的。删除'var'并解决了问题,我现在至少可以清除这些特性。 **

var selectedBusRoute = new FeatureLayer("http://PROD_RTC_SystemMap/MapServer/4", {
  mode: FeatureLayer.MODE_SELECTION,
  outFields: ["*"],
  infoTemplate: selectedBusRouteTemplate
});
var selectedBusStops = new FeatureLayer("http://PROD_RTC_SystemMap/MapServer/0", {
  mode: FeatureLayer.MODE_ONDEMAND,
  outFields: ["*"],
  infoTemplate: selectedBusStopsTemplate
});

我在想是否有办法操纵esri / dijit / HomeButton以某种方式完成所有这些或我是否在正确的轨道上? Esri/github/homebutton

感谢您花时间阅读本文并感谢所有输入(即使是那些说我的代码看起来像*#的人)。

以下是我调用函数的代码:

function goHome() {
  // Reset the Accordian Content Panes and fix naming
  var newTitle = "Bus Arrival Times";
  dijit.byId("pane3").set("title", newTitle);
  var container = dijit.byId("container");
  container.selectChild("RTCBusroutes", true);

  // This will remove old values in Bus Arrival Time pane so Bus Arrival Times will clear
  var results = document.getElementById("results");
  var rowCount = results.rows.length;
  for (var x = rowCount - 1; x > 0; x--) {
    results.deleteRow(x);
  }

  // Removes the Highlight from the currently selected Item in the RTC Bus Routes List pane
  $('.highlight').removeClass('highlight');

  // Scrolls to the top of the List in the RTC Bus Routes Content Pane List
  $('#RTCBusroutes').scrollTop(0);

  // Remove Currently Selected Bus Routes

  // Remove Currently Selectes Bus Stops

  // Zoom to Map Extent

}

这是我添加的按钮:

<button id="homeImg" onclick="goHome()">
  <img id="myImg" src="img/home.png" />
</button>

Home按钮的CSS #homeImg

/* for the Home Button CSS */

#homeImg {
  position: absolute;
  top: 138px;
  left: 28px;
  z-index: 8;
  background-color: #888888;
  opacity: 0.8;
  filter: alpha(opacity=80);
  cursor: pointer;
}

1 个答案:

答案 0 :(得分:1)

您可以通过调用.clear()方法清除featureLayer,然后清除图层中的所有图形。

如果您只想清除选择,请调用.clearSelections()方法。

此处有更多关于其他featurelayer方法的文档:

https://developers.arcgis.com/javascript/jsapi/featurelayer-amd.html#methods