在OpenLayer3中添加图标有两种方式

 

在OpenLayer3中添加图标有两种方式，一种是我们这一小节马上就要介绍的，比较传统的overlay，另一种是下一小节马上就要介绍的Feature + Style的方式。 overlay之所以传统，是因为它就是传统的html方式显示图片。 下面就是用这种方式加载一个锚点的示例：

 

 

缺点

当图标比较多的情况下，如果采用这种方式，那么我们会加入非常多的HTML元素，从而造成效率降低。 关于效率的测试，大家可以自行测试。 为什么会这样呢？ 因为界面上元素的遍历在数量比较多的情况下，会变慢，基于此基础上的渲染，鼠标事件都会变慢。

优点

这种使用传统的方式显示图标可以应用传统的HTML技术，比如鼠标移动到图标上，鼠标图标变成手势。 我们可以用css来处理就可以了

 

二.Feature + Style的方式

 

 

效果是一样的，但从代码上来看，是不一样的:

• 首先overlay需要HTML元素img，但这种方式不需要
• overlay是添加在map上的，但是这种方式需要一个Vector的layer，并添加在其上
• 我们没有办法像overlay那样使用一些HTML技术

应用

虽然不能用css直接修改图标显示，但并不是说使用这种方式没有自定义的余地，大家可以先在官网API上看一下ol.style.Icon的构造参数