arcgis js 4 完美支持mapV ,动画也支持(一)

之前我也看过有人弄过mapv和arcgis结合,但是还是不太完美,对于部分效果是不支持的比如动画,因此我自己弄一个arcgis版本的mapV出来

首先我们这次不是做插件 而是改造mapV, 去github 把整个mapV 下下来, 在mapV 构建两个类

首先是MapVRenderer.js 类

```javascript

import BaseLayer from "../../map/BaseLayer";

import DataSet from "../../data/DataSet";

export class MapVRenderer extends BaseLayer {

/**

Creates an instance of MapVRenderer.

@param{*} viewer cesium viewer

@param{*} dataset mapv dataset

@param{*} option mapvOptions

@param{*} mapVLayer

@memberofMapVRenderer

*/

constructor(viewer, dataset, option, mapVLayer) {

super(viewer, dataset, option)

if (!BaseLayer) {

return;

}

this.map = viewer,

// this.scene = viewer.scene,

this.dataSet = new DataSet(dataset);

option = option || {},

this.init(option),

this.argCheck(option),

this.initDevicePixelRatio(),

this.canvasLayer = mapVLayer,

this.stopAniamation = !1,

this.animation = option.animation,

this.clickEvent = this.clickEvent.bind(this),

this.mousemoveEvent = this.mousemoveEvent.bind(this),

this.bindEvent()

}

initDevicePixelRatio() {

this.devicePixelRatio = window.devicePixelRatio || 1

}

clickEvent(t) {

var e = t.point;

super.clickEvent(e, t)

}

mousemoveEvent(t) {

var e = t.point;

super.mousemoveEvent(e, t)

}

addAnimatorEvent() { }

animatorMovestartEvent() {

var t = this.options.animation;

this.isEnabledTime() && this.animator && (this.steps.step = t.stepsRange.start)

}

animatorMoveendEvent() {

this.isEnabledTime() && this.animator

}

bindEvent() {

this.map;

this.options.methods && (this.options.methods.click,

this.options.methods.mousemove)

}

unbindEvent() {

var t = this.map;

this.options.methods && (this.options.methods.click && t.off("click", this.clickEvent),

this.options.methods.mousemove && t.off("mousemove", this.mousemoveEvent))

}

getContext() {

return this.canvasLayer.canvas.getContext(this.context)

}

init(t) {

this.options = t,

this.initDataRange(t),

this.context = this.options.context || "2d",

this.options.zIndex && this.canvasLayer && this.canvasLayer.setZIndex(this.options.zIndex),

this.initAnimator()

}

_canvasUpdate(t) {

this.map;

let view = this.map;

var e = this.scene;

if (this.canvasLayer && !this.stopAniamation) {

var i = this.options.animation

, n = this.getContext();

if (this.isEnabledTime()) {

if (void 0 === t)

return void this.clear(n);

"2d" === this.context && (n.save(),

n.globalCompositeOperation = "destination-out",

n.fillStyle = "rgba(0, 0, 0, .1)",

n.fillRect(0, 0, n.canvas.width, n.canvas.height),

n.restore())

} else

this.clear(n);

if ("2d" === this.context)

for (var o in this.options)

n[o] = this.options[o];

else

n.clear(n.COLOR_BUFFER_BIT);

var a = {

transferCoordinate: (t)=> {

debugger

let coordinateType = this.getXYType(t[0],t[1]);

let coordXY = this.getRealXY(t[0],t[1],coordinateType);

let mapPoint = {

x: coordXY.x,

y: coordXY.y,

spatialReference: view.spatialReference

};

let screenPoint = view.toScreen(mapPoint);

return void 0 == n ? [-1, -1] : [screenPoint.x, screenPoint.y]

}

};

void 0 !== t && (a.filter = function (e) {

var n = i.trails || 10;

return !!(t && e.time > t - n && e.time < t)

}

);

var c = this.dataSet.get(a);

 更多消息参考https://xiaozhuanlan.com/topic/9052637481

你可能感兴趣的:(arcgis js 4 完美支持mapV ,动画也支持(一))