博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
实现绘制图形的ToolBar
阅读量:5271 次
发布时间:2019-06-14

本文共 1876 字,大约阅读时间需要 6 分钟。

  给地图添加绘制图形的ToolBar还是有必要的,比较人性化的功能。图形的样式可以自己定制,也提供了朴实的默认样式。对 dojo 不太懂,出现了许许多多问题,真是蛋疼的一天啊。令人惊喜的是 ArcGis 不仅提供了 point,line,mulitpoint,polyline,polygon 等基本图形,还有circle,trinangle,ellipse这样的特殊类型。

  一.首先我们需要设置各要素对象的样式(以最基本的Symbol为例):

var markerSymbol = new esri.symbol.SimpleMarkerSymbol();markerSymbol.setColor(new esri.Color("#FF8F8F"));var lineSymbol = new esri.symbol.SimpleLineSymbol();lineSymbol.setColor(new esri.Color([255, 143, 143, 1]));lineSymbol.setWidth(2);var fillSymbol = new esri.symbol.PictureFillSymbol("img/fill.png",new esri.symbol.SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color('#000'), 1),42, 42);

  二.在地图加载后,初始化toolbar工具:

Tool Bar

  不知道为什么dojo提供的dojo.on注册事件的方法我无法使用,例子里是用on(dom.byId("info"), "click", function(evt) {}定义事件的。

var map,tb;map.on("load", initToolbar);...function initToolbar() {    tb = new esri.toolbars.Draw(map);    tb.on("draw-end", addGraphic);    document.getElementById("info").onclick = function (evt) {    if (evt.target.id == "") {
return;} var tool = evt.target.id.toLowerCase(); map.disableMapNavigation(); tb.activate(tool); }}

  三.toolbar是根据它active方法中的参数决定绘制类型的。

function addGraphic(evt) {  tb.deactivate();   map.enableMapNavigation();  var symbol;  if ( evt.geometry.type == "point" || evt.geometry.type == "multipoint")  {    symbol = markerSymbol;  } else if ( evt.geometry.type == "line" || evt.geometry.type == "polyline")  {    symbol = lineSymbol;  }  else  {    symbol = fillSymbol;  }  map.graphics.add(new Graphic(evt.geometry, symbol));}

效果:

                                  

实例链接:

我还发现了个错误,在回传按钮id时,点击 id = "info" 的<div>时,实例中仍然以 evt.target.id 作为判断依据是错误的,这时的返回值为"";

转载于:https://www.cnblogs.com/qdhotel/p/3876242.html

你可能感兴趣的文章