先是在projectquantan-master这个项目中有一个EditingPanel这个工具条,也挺好的,功能挺全的,但是有一点就是只有画多边形的一个按钮,没有point和path俩个的,所以就想自己去加一个。

然后就发现统一的drawfeature的样式(olControlDrawFeatureItemInactive),没有分为point、path和polygon的,然后就去源代码中找控制这个样式点代码去修改他,但是始终没有找到,只能作罢。

又去网上搜索找到了openlayers自带的一个control(new OpenLayers.Control.EditingToolbar(vector_layer),这个上面有四个按钮,point、path、polygon和pan,还好,正打算用它和之前的editingpanel一起做一个东西呢,

发现了这个  var controls = [

new OpenLayers.Control.DrawFeature(layer, OpenLayers.Handler.Polygon, {'displayClass': 'olControlDrawFeaturePolygon'}),

new OpenLayers.Control.DrawFeature(layer, OpenLayers.Handler.Path, {'displayClass': 'olControlDrawFeaturePath'}),

new OpenLayers.Control.DrawFeature(layer, OpenLayers.Handler.Point, {'displayClass': 'olControlDrawFeaturePoint'})

];就是后面的class可以自己加,

就尝试着在EditingPanel中加一个同样的,没想到就成功了。真是踏破铁鞋无觅处啊。最后代码:

 1  1 /**
2 2 * Provide a custom editing panel for editing a vec layer.
3 3 * Not meant to be general purpose.
4 4 */
5 5 var EditingPanel = OpenLayers.Class(OpenLayers.Control.Panel, {
6 6
7 7 initialize: function(layer) {
8 8
9 9 OpenLayers.Control.Panel.prototype.initialize.apply(this, [{}]);
10 10
11 11 var navigate = new OpenLayers.Control.Navigation({
12 12 title: "Pan Map"
13 13 });
14 14
15 15
16 16 var drawFeaturePoint = new OpenLayers.Control.DrawFeature(
17 17 layer, OpenLayers.Handler.Point, {
18 18 title: "画点",
19 19 handlerOptions: {multi: true},
20 20 displayClass: 'olControlDrawFeaturePoint'
21 21 }
22 22 );
23 23
24 24 var drawFeaturePath= new OpenLayers.Control.DrawFeature(
25 25 layer, OpenLayers.Handler.Path, {
26 26 title: "画线",
27 27 handlerOptions: {multi: true},
28 28 displayClass: 'olControlDrawFeaturePath'
29 29 }
30 30 );
31 31 var drawFeaturePolygon = new OpenLayers.Control.DrawFeature(
32 32 layer, OpenLayers.Handler.Polygon, {
33 33 title: "画多边形",
34 34 handlerOptions: {multi: true},
35 35 displayClass: 'olControlDrawFeaturePolygon'
36 36 }
37 37 );
38 38
39 39 var edit = new OpenLayers.Control.ModifyFeature(layer, {
40 40 title: "修改要素"
41 41 });
42 42
43 43 var del = new DeleteFeature(layer, {title: "删除要素"});
44 44
45 45 var save = new OpenLayers.Control.Button({
46 46 title: "保存更改",
47 47 trigger: function() {
48 48 if(edit.feature) {
49 49 edit.selectControl.unselectAll();
50 50 }
51 51 // fails if no save strategy
52 52 var strat = OpenLayers.Array.filter(
53 53 layer.strategies,
54 54 function(s) {
55 55 return s instanceof OpenLayers.Strategy.Save;
56 56 }
57 57 )[0];
58 58 strat.save();
59 59 },
60 60 displayClass: "olControlSaveFeatures"
61 61 });
62 62
63 63 this.defaultControl = navigate;
64 64 //this.addControls([save, del, edit,drawFeaturePoint,drawFeaturePath,drawFeaturePolygon, navigate]);
65 65 this.addControls([navigate,drawFeaturePoint,drawFeaturePath,drawFeaturePolygon, edit, del,save]);
66 66
67 67 },
68 68
69 69 CLASS_NAME: "EditingPanel"
70 70 });

上面一个简略的问题解决的流程,只要有耐心问题自会得到解决的。千万不要自己放弃,打心底里相信问题能够得到解决。

要相信只要去坚持,问题总会解决,当然坚持不是盲目的坚持,不断的寻找解决问题的方法,问题总能在不经意间得到完美的解决。只是有时候过程有点慢吧,不过刚开始没经验嘛,慢一点多积累经验都一样,后来会越来越快的,只能说你对事物的认知在慢慢的加深,问题就会慢慢得到来解决。

openlayers中的自定制工具栏,包含画点、线、面的更多相关文章

  1. OpenLayers中的图层

    OpenLayers有多个不同的图层类,每一个都可以连接到不同的地图服务器.例如通过Layer.WMS类可以连接到WMS地图服务器,通过Layer.Google类可以连接到谷歌地图服务器.OpenLa ...

  2. OpenLayers中的球面墨卡托投影

    最近看OpenLayers,研究到地图投影时找到官方的文档,就翻译了一下,由于英文能力差,翻译不好的地方,请看原文 原文地址:http://docs.openlayers.org/library/sp ...

  3. OpenLayers中的图层(转载)

    作者:田念明出处:http://www.cnblogs.com/nianming/本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法 ...

  4. openlayers中单击获取要素

    openlayers中单击获取要素 分类专栏: GIS 总结 OpenLayers   版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接: ...

  5. eclipse定制工具栏,修改工具栏

    目前eclipse定制工具栏的入口就是window- customize perspective,在弹出的窗口中选择Tool Bar Visibility,选择要在工具栏中显示的快捷图标.注:在Too ...

  6. 参考bootstrap中的popover.js的css画消息弹框

    前段时间小颖的大学同学给小颖发了一张截图,图片类似下面这张图: 小颖当时大概的给她说了下,其实小颖也不知道上面那个三角形怎么画嘻嘻,给她说了DOM结构,具体的css让她自己百度,今天小颖自己参考boo ...

  7. OpenLayers中地图缩放级别的设置方法

    来源于:http://www.cnblogs.com/sailheart/archive/2011/03/15/1984519.html 一.概述 在OpenLayers中,地图必须具有一个缩放级别的 ...

  8. OpenLayers中的Layer概念和实践--Openlayers调用WMS服务

    整理转自:http://hi.baidu.com/lixuweiok/item/c406a4e6a6d390e7fa42ba4b 本章我认为是这本书的真正开端,终于开始讲一些有意思的东西了.. 在这一 ...

  9. android中实现在ImageView上随意画线涂鸦

    我实现的思路: 1.继承ImageView类 2.重写onTouchEvent方法,在ACTION_MOVE(即移动时),记录下所经过的点坐标,在ACTION_UP时(即手指离开时,这时一条线已经画完 ...

随机推荐

  1. Hibernate一对多关系操作

    1.创建两个实体类. 一个实体类是商品类,另一个实体类是商品的分类类. 在一对多关系的两个实体中,在编写实体类时必须要遵循以下规则: (1)在一的那一方的实体中,必须要有一个私有的多那一方的实体对象属 ...

  2. Array中对象的排序

    1.子母排序 NSArray *kArrSort = [_dic allKeys]; //这里是字母数组:,g,a,b.y,m…… NSArray *resultkArrSort = [kArrSor ...

  3. log4j 详细讲解

    日志是应用软件中不可缺少的部分,Apache的开源项目log4j是一个功能强大的日志组件,提供方便的日志记录.在apache网站:jakarta.apache.org/log4j 可以免费下载到Log ...

  4. 自动生成数据库字典(sql2008) 转自 飘渺の云海

    每次做项目的时候都要做数据字典,这种重复的工作实在很是痛苦,于是广找资料,终于完成了自动生成数据库字典的工作,废话少说,上代码. 截取一部分图片: 存储过程: SET ANSI_NULLS ON GO ...

  5. CORS跨域请求C#版

    1.什么是跨域请求:  当从A网站使用AJAX请求B网站时,就会出现跨域请求. 此时B网站能够接收到A网站发来的请求并返回相应的结果,但是浏览器拿到B网站返回的数据时检测到与当前网站的域名不同,出于安 ...

  6. Axios介绍和使用

    一.介绍 Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中. 官方资料和介绍 从浏览器中创建 XMLHttpRequests 从 node.js 创建 h ...

  7. 关于移动web开发过程中的”点透“问题

    先说说故事发生的场景,举个栗子如下图: A是遮罩层,B是正常的DOM,C是B上的某个元素,这里是链接.场景是点击A的时候A消失,结果点到了C,页面发生了跳转,这显然不是咱想要的~ 下面我们来监测点击事 ...

  8. 关于开发Cesium造成的电脑风扇狂飙的问题

    最近在开发Cesium的项目,每次一打开浏览器渲染3D 模型.风扇就狂飙起来,进任务管理器查看发现集显使用率100%,独显使用率0%.使用的是集显进行渲染.怪不得风扇会飙起来.既然知道问题所在,解决的 ...

  9. react 使用fortawesome字体图标

    fontawesome 官方使用教程=>点我 npm i --save @fortawesome/fontawesome-svg-core@prerelease \ npm i --save @ ...

  10. vim使用方法----转载

    转载自:http://www.cnblogs.com/itech/archive/2009/04/17/1438439.html vi/vim 基本使用方法本文介绍了vi (vim)的基本使用方法,但 ...