openlayers3线段添加闪烁_openlayers4中闪烁点的实现

概述：

本文讲述如何在Openlayers4中实现闪烁点。

效果：

代码：

1、flash-marker.js闪烁点扩展

(function (global, factory) {

typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :

typeof define === 'function' && define.amd ? define(factory) :

(global.FlashMarker = factory());

}(this, (function () { 'use strict';

/**

* @author lzugis

* @Date 2017-09-29

* */

function CanvasLayer(options) {

this.options = options || {};

this.paneName = this.options.paneName || 'labelPane';

this.zIndex = this.options.zIndex || 0;

this._map = options.map;

this._lastDrawTime = null;

this.show();

}

CanvasLayer.prototype.initialize = function () {

var map = this._map;

var canvas = this.canvas = document.createElement('canvas');

var ctx = this.ctx = this.canvas.getContext('2d');

canvas.style.cssText = 'position:absolute;' + 'left:0;' + 'top:0;' + 'z-index:' + this.zIndex + ';';

this.adjustSize();

this.adjustRatio(ctx);

map.getViewport().appendChild(canvas);

var that = this;

map.getView().on('propertychange',function(){

$(canvas).hide();

});

map.on("moveend",function(){

$(canvas).show();

that.adjustSize();

that._draw();

});

};

CanvasLayer.prototype.adjustSize = function () {

var size = this._map.getSize