arcgis 4 与deckgl 整合 （二）

针对deckgl TripsLayer

我们构建采集器，目的是支持多种数据类型到 TripsLayer, 并且支持arcgis 服务

const axios = require('axios')

export default class TripsLayerParser {

static getDataFromUrl(url: string) {

return new Promise((resolve => {

const queryUrl = `${url}/query?where=1%3D1&text=&objectIds=&time=&geometry=&geometryType=esriGeometryEnvelope&inSR=&spatialRel=esriSpatialRelIntersects&relationParam=&outFields=%5B%5D&returnGeometry=true&returnTrueCurves=false&maxAllowableOffset=&geometryPrecision=&outSR=&returnIdsOnly=false&returnCountOnly=false&orderByFields=&groupByFieldsForStatistics=&outStatistics=&returnZ=false&returnM=false&gdbVersion=&returnDistinctValues=false&resultOffset=&resultRecordCount=&queryByDistance=&returnExtentsOnly=false&datumTransformation=&parameterValues=&rangeValues=&f=geojson`;

axios.get(queryUrl).then((r: any) => {

let data = this.getTimestampFromGeoJson(r.data);

resolve(data);

});

}));

}

static getDataFromJsonUrl(url: string) {

return new Promise((resolve => {

axios.get(url).then((r: any) => {

let data = this.getTimestampFromGeoJson(r.data);

resolve(data);

});

}));

}

static getDataFromArray(array: any) {

return this.getTimestampFromArray(array);

}

private static getTimestampFromArray(lines: any) {

let data: any = [];

lines.forEach((line: any) => {

data.push({

path: line.geometry,

timestamps: this.getRandomTimestamp(line.geometry.length)

});

});

return data;

}

private static getTimestampFromGeoJson(dataArray: any) {

let lines = dataArray.features;

let data: any = [];

lines.forEach((line: any) => {

if (line.geometry.type === "MultiLineString") {

for (let item of line.geometry.coordinates) {

data.push({

path: item,

timestamps: this.getRandomTimestamp(item.length)

});

}

} else {

data.push({

path: line.geometry.coordinates,

timestamps: this.getRandomTimestamp(line.geometry.coordinates.length)

});

}

});

return data;

}

private static getRandomTimestamp(length: number) {

let timestamps: any = [];

for (let i = 0; i < length; i++) {

timestamps.push(i * 100);

}

return timestamps;

}

}

封装的

```javascript

import BaseLayer from "./BaseLayer";

import TripsLayerParser from "./TripsLayerParser";

import ColorManager from "./ColorManager";

const {TripsLayer} = require("@deck.gl/geo-layers");

export default class DeckTripsLayer extends BaseLayer {

view: any;

options: any;

更多参考arcgis 4 与deckgl 整合 （二） － 小专栏 (xiaozhuanlan.com)