kepler.gl.geoiq
Version:
kepler.gl is a webgl based application to visualize large scale location data in the browser
225 lines (206 loc) • 7.36 kB
JavaScript
// Copyright (c) 2019 Uber Technologies, Inc.
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
// of this software and associated documentation files (the "Software"), to deal
// in the Software without restriction, including without limitation the rights
// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
// copies of the Software, and to permit persons to whom the Software is
// furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
// THE SOFTWARE.
import Widget from '../base-widget';
import {aggregate} from '../../utils/aggregate-utils';
import FunctionWidgetIcon from './function-widget-icon';
import geoViewport from '@mapbox/geo-viewport';
import WebMercatorViewport from 'viewport-mercator-project';
import {getFileType} from 'processors/file-handler';
import booleanDisjoint from '@turf/boolean-disjoint';
import {point, polygon} from '@turf/helpers';
// import simplify from '@turf/simplify';
import simplify from 'simplify-geojson';
export default class FunctionWidget extends Widget {
constructor(props) {
super(props);
}
get type() {
return 'Function';
}
get isAggregated() {
return false;
}
get widgetIcon() {
return FunctionWidgetIcon;
}
get widgetAggregatedData() {
return null;
}
calculateAggregationData(newWidget, state, mapState) {
let latRange, lngRange;
const {dataId, aggregationType, bounds} = newWidget.config;
let boundingBox;
let cUL, cUR, cLL, cLR;
var {data, label} = state.datasets[dataId];
if (!newWidget.config.selectedLayer) {
return newWidget;
}
const idx = state.layers.findIndex(
l => l.id === newWidget.config.selectedLayer.id
);
const {fields} = state.datasets[dataId];
if (mapState && bounds) {
const {
longitude,
latitude,
height,
width,
zoom,
pitch,
bearing
} = mapState;
boundingBox = geoViewport.bounds([longitude, latitude], zoom, [
width,
height
]);
const viewport = new WebMercatorViewport({
width: width,
height: height,
longitude: longitude,
latitude: latitude,
zoom: zoom,
pitch: pitch,
bearing: bearing
});
cUL = viewport.unproject([0, 0]);
cUR = viewport.unproject([width, 0]);
cLR = viewport.unproject([width, height]);
cLL = viewport.unproject([0, height]);
latRange = [...new Set([cLL[1], cUR[1], cLR[1], cUL[1]])].sort(
(a, b) => a - b
);
lngRange = [...new Set([cLL[0], cUR[0], cLR[0], cUL[0]])].sort(
(a, b) => a - b
);
const boundingPolygon = {
type: 'Polygon',
coordinates: [[cUL, cUR, cLR, cLL]],
crs: {
type: 'name',
properties: {
name: 'EPSG:4326'
}
}
};
if (getFileType(label) !== 'json' && boundingBox) {
const latIdx = state.layers[idx].config.columns.lat.fieldIdx;
const lngIdx = state.layers[idx].config.columns.lng.fieldIdx;
data = data.filter(d =>
pitch || bearing
? !booleanDisjoint(point([d[lngIdx], d[latIdx]]), boundingPolygon)
: d[latIdx] > latRange[0] &&
d[latIdx] < latRange[1] &&
d[lngIdx] > lngRange[0] &&
d[lngIdx] < lngRange[1]
);
} else if (boundingBox) {
if (
!state.datasets[dataId].simplifiedGeoJSON ||
data.length !== state.datasets[dataId].simplifiedGeoJSON.length
) {
state = {
...state,
datasets: {
...state.datasets,
[dataId]: {
...state.datasets[dataId],
simplifiedGeoJSON: data.map(d => [
...d,
(d[0] = simplify(d[0], 0.01))
])
}
}
};
}
//commented part is using viewport to tell which point is in the viewport and faster than turf.js
// console.log('state inside geojson aggregation ', state);
// data = state.d atasets[dataId].simplifiedGeoJSON.filter(d =>
// d.geometry.coordinates.reduce((accu, val) => {
// var pointInsideBounds = false;
// if (accu) return accu;
// var i = 0;
// const flatVal = flatValToPoint(val);
// // if (val[i].length > 2) {
// // flatVal = val.flat();
// // }
// do {
// const p = flatVal[i];
// // console.log('point inside do while loop', p);
// if (
// viewport.project([p[0], p[1]])[0] > 0 &&
// viewport.project([p[0], p[1]])[0] < width &&
// viewport.project([p[0], p[1]])[1] > 0 &&
// viewport.project([p[0], p[1]])[1] < height
// ) {
// pointInsideBounds = true;
// }
// i++;
// } while (!pointInsideBounds && i < val.length);
// return pointInsideBounds;
// }, false)
// );
data = state.datasets[dataId].simplifiedGeoJSON.filter(
d => !booleanDisjoint(d[0], boundingPolygon)
);
// console.log(
// viewport.project([0, 0])[0] > 0 && viewport.project([0, 0])[0] < width
// );
// console.log(data.length);
// data = state.datasets[dataId].simplifiedGeoJSON.filter(
// d => !booleanDisjoint(d, boundingPolygon)
// );
// console.log(data.length);
// data = data.map(d => {
// console.log(d[0]);
// console.log();
// });
}
}
if (aggregationType === 'count') {
newWidget.config.aggregatedData = data.length;
} else {
const fieldName = newWidget.config.fieldName;
const fieldIdx = fields.findIndex(f => f.name === fieldName);
if (fieldName) {
let fieldData = data.map(d => {
if (d.data) {
return d.data[fieldIdx];
} else {
return d[fieldIdx];
}
});
const aggregatedData = aggregate(fieldData, aggregationType);
if (typeof aggregatedData === 'number') {
newWidget.config.aggregatedData = +aggregatedData.toFixed(2);
} else {
newWidget.config.aggregatedData = aggregatedData;
}
newWidget.config.aggregatedData;
}
}
// console.log(
// 'newWidget and state inside calculateAggregationData',
// newWidget,
// state
// );
newWidget.config.isCalculating = false;
return {newWidget, updatedState: state};
}
}