@carto/kepler.gl 0.0.81 → 0.0.82

package/src/layers/point-layer/point-layer.js

@@ -1,412 +0,0 @@
-// Copyright (c) 2022 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 {BrushingExtension} from '@deck.gl/extensions';
-import {ScatterplotLayer} from '@deck.gl/layers';
-import {IconLayer} from '@deck.gl/layers';
-
-import Layer from '../base-layer';
-import {hexToRgb} from 'utils/color-utils';
-import {negateAccessor} from 'utils/layer-utils';
-import {findDefaultColorField} from 'utils/dataset-utils';
-import PointLayerIcon from './point-layer-icon';
-import {DEFAULT_LAYER_COLOR, CHANNEL_SCALES, UNKNOWN_COLOR} from 'constants/default-settings';
-
-import {formatTextLabelData} from '../layer-text-label';
-
-export const pointPosAccessor = ({lat, lng, altitude}) => dc => d => [
-  dc.valueAt(d.index, lng.fieldIdx),
-  dc.valueAt(d.index, lat.fieldIdx),
-  altitude && altitude.fieldIdx > -1 ? dc.valueAt(d.index, altitude.fieldIdx) : 0
-];
-
-export const pointRequiredColumns = ['lat', 'lng'];
-export const pointOptionalColumns = ['altitude'];
-
-const brushingExtension = new BrushingExtension();
-
-export const pointVisConfigs = {
-  radius: 'radius',
-  customMarkers: 'customMarkers',
-  customMarkersUrl: 'customMarkersUrl',
-  customMarkersId: 'customMarkersId',
-  customMarkersRange: 'customMarkersRange',
-  opacity: 'opacity',
-  outline: 'outline',
-  thickness: 'thickness',
-  strokeColor: 'strokeColor',
-  colorRange: 'colorRange',
-  strokeColorRange: 'strokeColorRange',
-  radiusRange: 'radiusRange',
-  filled: {
-    type: 'boolean',
-    label: 'layer.fillColor',
-    defaultValue: true,
-    property: 'filled'
-  }
-};
-
-export default class PointLayer extends Layer {
-  constructor(props) {
-    super(props);
-
-    this.registerVisConfig(pointVisConfigs);
-    this.getPositionAccessor = dataContainer =>
-      pointPosAccessor(this.config.columns)(dataContainer);
-  }
-
-  get type() {
-    return 'point';
-  }
-
-  get isAggregated() {
-    return false;
-  }
-
-  get layerIcon() {
-    return PointLayerIcon;
-  }
-  get requiredLayerColumns() {
-    return pointRequiredColumns;
-  }
-
-  get optionalColumns() {
-    return pointOptionalColumns;
-  }
-
-  get columnPairs() {
-    return this.defaultPointColumnPairs;
-  }
-
-  get noneLayerDataAffectingProps() {
-    return [...super.noneLayerDataAffectingProps, 'radius'];
-  }
-
-  get visualChannels() {
-    return {
-      color: {
-        ...super.visualChannels.color,
-        accessor: 'getFillColor',
-        condition: config => config.visConfig.filled,
-        defaultValue: config => config.color
-      },
-      strokeColor: {
-        property: 'strokeColor',
-        key: 'strokeColor',
-        field: 'strokeColorField',
-        scale: 'strokeColorScale',
-        domain: 'strokeColorDomain',
-        range: 'strokeColorRange',
-        channelScaleType: CHANNEL_SCALES.color,
-        accessor: 'getLineColor',
-        condition: config => config.visConfig.outline,
-        defaultValue: config => config.visConfig.strokeColor || config.color
-      },
-      size: {
-        ...super.visualChannels.size,
-        property: 'radius',
-        range: 'radiusRange',
-        channelScaleType: 'radius',
-        accessor: 'getRadius',
-        defaultValue: 1
-      },
-      customMarkers: {
-        property: 'customMarkers',
-        key: 'customMarkers',
-        field: 'customMarkersField',
-        scale: 'customMarkersScale',
-        domain: 'customMarkersDomain',
-        range: 'customMarkersRange',
-        fixed: 'customMarkersUrl',
-        channelScaleType: CHANNEL_SCALES.customMarker,
-        accessor: 'getIconUrl',
-        supportedFieldTypes: ['string'],
-        defaultValue: config => config.visConfig.customMarkersUrl,
-        condition: config => config.visConfig.customMarkers
-      },
-      rotation: {
-        property: 'rotation',
-        key: 'rotation',
-        field: 'rotationField',
-        channelScaleType: CHANNEL_SCALES.identity,
-        accessor: 'getRotation',
-        supportedFieldTypes: ['float', 'integer', 'real', 'number'],
-        defaultValue: () => 0,
-        nullValue: 0,
-        condition: config => config.rotationField
-      }
-    };
-  }
-
-  setInitialLayerConfig(dataset) {
-    const defaultColorField = findDefaultColorField(dataset);
-
-    if (defaultColorField) {
-      this.updateLayerConfig({
-        colorField: defaultColorField
-      });
-      this.updateLayerVisualChannel(dataset, 'color');
-    }
-
-    return this;
-  }
-
-  static findDefaultLayerProps({fieldPairs = []}) {
-    const props = [];
-
-    // Make layer for each pair
-    fieldPairs.forEach(pair => {
-      const latField = pair.pair.lat;
-      const lngField = pair.pair.lng;
-      const layerName = pair.defaultName;
-
-      const prop = {
-        label: layerName.length ? layerName : 'Point'
-      };
-
-      // default layer color for begintrip and dropoff point
-      if (latField.value in DEFAULT_LAYER_COLOR) {
-        prop.color = hexToRgb(DEFAULT_LAYER_COLOR[latField.value]);
-      }
-
-      // set the first layer to be visible
-      if (props.length === 0) {
-        prop.isVisible = true;
-      }
-
-      prop.columns = {
-        lat: latField,
-        lng: lngField,
-        altitude: {value: null, fieldIdx: -1, optional: true}
-      };
-
-      props.push(prop);
-    });
-
-    return {props};
-  }
-
-  getDefaultLayerConfig(props = {}) {
-    return {
-      ...super.getDefaultLayerConfig(props),
-
-      // add stroke color visual channel
-      strokeColorField: null,
-      strokeColorDomain: [0, 1],
-      strokeColorScale: 'quantile',
-
-      customMarkersField: null,
-      customMarkersScale: 'ordinal'
-    };
-  }
-
-  calculateDataAttribute({filteredIndex}, getPosition) {
-    const data = [];
-
-    for (let i = 0; i < filteredIndex.length; i++) {
-      const index = filteredIndex[i];
-      const pos = getPosition({index});
-
-      // if doesn't have point lat or lng, do not add the point
-      // deck.gl can't handle position = null
-      if (pos.every(Number.isFinite)) {
-        data.push({
-          position: pos,
-          index
-        });
-      }
-    }
-    return data;
-  }
-
-  formatLayerData(datasets, oldLayerData) {
-    const {textLabel} = this.config;
-    const {gpuFilter, dataContainer} = datasets[this.config.dataId];
-    const {data} = this.updateData(datasets, oldLayerData);
-    const getPosition = this.getPositionAccessor(dataContainer);
-
-    // get all distinct characters in the text labels
-    const textLabels = formatTextLabelData({textLabel, dataContainer});
-
-    const accessors = this.getAttributeAccessors({dataContainer});
-
-    return {
-      data,
-      getPosition,
-      getFilterValue: gpuFilter.filterValueAccessor(dataContainer)(),
-      textLabels,
-      ...accessors
-    };
-  }
-  /* eslint-enable complexity */
-
-  updateLayerMeta(dataContainer) {
-    const getPosition = this.getPositionAccessor(dataContainer);
-    const bounds = this.getPointsBounds(dataContainer, getPosition);
-    this.updateMeta({bounds});
-  }
-
-  isLayerHovered(objectInfo) {
-    return (
-      (objectInfo?.picked && objectInfo?.layer?.props?.id === this.id) ||
-      objectInfo?.layer?.props?.id === `${this.id}-icon`
-    );
-  }
-
-  // eslint-disable-next-line complexity, max-statements
-  renderLayer(opts) {
-    const {data, gpuFilter, objectHovered, interactionConfig} = opts;
-    const {customMarkers, customMarkersUrl, customMarkersRange} = this.config.visConfig;
-
-    const radiusScale = this.getRadiusScale();
-
-    const defaultLayerProps = this.getDefaultDeckLayerProps(opts);
-    const brushingProps = this.getBrushingExtensionProps(interactionConfig);
-    const extensions = [...defaultLayerProps.extensions, brushingExtension];
-
-    const updateTriggers = {
-      getPosition: this.config.columns,
-      getFilterValue: gpuFilter.filterValueUpdateTriggers,
-      ...this.getVisualChannelUpdateTriggers()
-    };
-
-    const sharedProps = {
-      getFilterValue: data.getFilterValue,
-      extensions,
-      filterRange: defaultLayerProps.filterRange,
-      maskId: defaultLayerProps.maskId,
-      visible: defaultLayerProps.visible,
-      ...brushingProps
-    };
-    const hoveredObject = this.hasHoveredObject(objectHovered);
-
-    const textLabelLayer = this.renderTextLabelLayer(
-      {
-        getPosition: data.getPosition,
-        sharedProps,
-        // TODO remove this scaling by half here and elsewhere
-        radiusScale: customMarkers ? radiusScale / 2 : radiusScale,
-        getRadius: data.getRadius,
-        updateTriggers
-      },
-      opts
-    );
-    const commonLayerProps = {
-      ...defaultLayerProps,
-      parameters: {
-        // circles will be flat on the map when the altitude column is not used
-        depthTest: this.config.columns.altitude?.fieldIdx > -1
-      }
-    };
-
-    const customMarkersField = this.config.customMarkersField;
-    const customMarkersConfigured =
-      customMarkers && Boolean(customMarkersUrl || (customMarkersField && customMarkersRange));
-    const customMarkersMisConfigured = customMarkers && !customMarkersConfigured;
-
-    if (customMarkersConfigured) {
-      const maxIconSize = this.getMaxMarkerSize();
-      const useMask = Boolean(this.config.visConfig.filled);
-      const iconLayerProps = {
-        getIcon: this.getCustomMarkerIconAccessor(data.getIconUrl, useMask),
-        getPosition: data.getPosition,
-        getSize: data.getRadius,
-        getAngle: negateAccessor(data.getRotation),
-        sizeScale: radiusScale,
-        sizeUnits: 'pixels',
-        loadOptions: {
-          image: {
-            type: 'imagebitmap'
-          },
-          imagebitmap: {
-            resizeWidth: maxIconSize,
-            resizeHeight: maxIconSize,
-            resizeQuality: 'high'
-          }
-        }
-      };
-
-      return [
-        new IconLayer({
-          ...commonLayerProps,
-          ...iconLayerProps,
-          id: `${defaultLayerProps.id}-icon`,
-          data: data.data,
-          getColor: this.config.visConfig.filled ? data.getFillColor : UNKNOWN_COLOR,
-          getFilterValue: data.getFilterValue,
-          updateTriggers: {
-            getFilterValue: updateTriggers.getFilterValue,
-            getColor: {...updateTriggers.getFillColor, filled: this.config.visConfig.filled},
-            getIcon: {...updateTriggers.getIconUrl, maxIconSize, useMask},
-            getSize: updateTriggers.getRadius,
-            getAngle: updateTriggers.getRotation
-          }
-        }),
-        new IconLayer({
-          ...iconLayerProps,
-          ...this.getDefaultHoverLayerProps(),
-          id: `${defaultLayerProps.id}-icon-hovered`,
-          data: hoveredObject ? [hoveredObject] : [],
-          getColor: this.config.highlightColor,
-          visible: Boolean(hoveredObject)
-        }),
-        ...textLabelLayer
-      ];
-    }
-
-    const scatterPlotLayerProps = {
-      stroked: this.config.visConfig.outline,
-      filled: this.config.visConfig.filled,
-      lineWidthScale: this.config.visConfig.thickness,
-      // TODO: invent better way to render something when customMarkers are not yet configured
-      radiusScale: customMarkersMisConfigured ? radiusScale / 2 : radiusScale,
-      radiusMaxPixels: 500
-    };
-
-    return [
-      new ScatterplotLayer({
-        ...brushingProps,
-        ...data,
-        ...commonLayerProps,
-        ...scatterPlotLayerProps,
-        radiusUnits: 'pixels',
-        lineWidthUnits: 'pixels',
-        updateTriggers,
-        extensions
-      }),
-      // hover layer
-      ...(hoveredObject
-        ? [
-            new ScatterplotLayer({
-              ...this.getDefaultHoverLayerProps(),
-              ...scatterPlotLayerProps,
-              data: [hoveredObject],
-              getLineColor: this.config.highlightColor,
-              getFillColor: this.config.highlightColor,
-              getRadius: data.getRadius,
-              getPosition: data.getPosition
-            })
-          ]
-        : []),
-      // text label layer
-      ...textLabelLayer
-    ];
-  }
-}

package/src/layers/s2-geometry-layer/s2-geometry-layer.js

@@ -1,265 +0,0 @@
-// Copyright (c) 2022 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 {S2Layer} from '@deck.gl/geo-layers';
-import {HIGHLIGH_COLOR_3D, CHANNEL_SCALES} from 'constants/default-settings';
-import {LAYER_VIS_CONFIGS} from 'layers/layer-factory';
-import {createDataContainer} from 'utils/table-utils';
-import Layer from '../base-layer';
-import S2LayerIcon from './s2-layer-icon';
-import {getS2Center} from './s2-utils';
-
-export const S2_TOKEN_FIELDS = {
-  token: ['s2', 's2_token']
-};
-
-export const s2RequiredColumns = ['token'];
-export const S2TokenAccessor = ({token}) => dc => d => dc.valueAt(d.index, token.fieldIdx);
-
-export const defaultElevation = 500;
-export const defaultLineWidth = 1;
-
-export const S2VisConfigs = {
-  // Filled color
-  opacity: 'opacity',
-  colorRange: 'colorRange',
-  filled: {
-    type: 'boolean',
-    label: 'Fill Color',
-    defaultValue: true,
-    property: 'filled'
-  },
-
-  // stroke
-  thickness: {
-    ...LAYER_VIS_CONFIGS.thickness,
-    defaultValue: 0.5
-  },
-  strokeColor: 'strokeColor',
-  strokeColorRange: 'strokeColorRange',
-  sizeRange: 'strokeWidthRange',
-  stroked: 'stroked',
-
-  // height
-  enable3d: 'enable3d',
-  elevationScale: 'elevationScale',
-  enableElevationZoomFactor: 'enableElevationZoomFactor',
-  heightRange: 'elevationRange',
-
-  // wireframe
-  wireframe: 'wireframe'
-};
-
-export default class S2GeometryLayer extends Layer {
-  constructor(props) {
-    super(props);
-    this.registerVisConfig(S2VisConfigs);
-    this.getPositionAccessor = dataContainer => S2TokenAccessor(this.config.columns)(dataContainer);
-  }
-
-  get type() {
-    return 's2';
-  }
-
-  get name() {
-    return 'S2';
-  }
-
-  get requiredLayerColumns() {
-    return s2RequiredColumns;
-  }
-
-  get layerIcon() {
-    return S2LayerIcon;
-  }
-
-  get visualChannels() {
-    const visualChannels = super.visualChannels;
-    return {
-      color: {
-        ...visualChannels.color,
-        accessor: 'getFillColor'
-      },
-      size: {
-        ...visualChannels.size,
-        property: 'stroke',
-        accessor: 'getLineWidth',
-        condition: config => config.visConfig.stroked,
-        defaultValue: defaultLineWidth
-      },
-      strokeColor: {
-        property: 'strokeColor',
-        field: 'strokeColorField',
-        scale: 'strokeColorScale',
-        domain: 'strokeColorDomain',
-        range: 'strokeColorRange',
-        key: 'strokeColor',
-        channelScaleType: CHANNEL_SCALES.color,
-        accessor: 'getLineColor',
-        condition: config => config.visConfig.stroked,
-        nullValue: visualChannels.color.nullValue,
-        defaultValue: config => config.visConfig.strokeColor || config.color
-      },
-      height: {
-        property: 'height',
-        field: 'heightField',
-        scale: 'heightScale',
-        domain: 'heightDomain',
-        range: 'heightRange',
-        key: 'height',
-        channelScaleType: CHANNEL_SCALES.size,
-        accessor: 'getElevation',
-        condition: config => config.visConfig.enable3d,
-        nullValue: 0,
-        defaultValue: defaultElevation
-      }
-    };
-  }
-
-  getDefaultLayerConfig(props = {}) {
-    return {
-      ...super.getDefaultLayerConfig(props),
-
-      // add height visual channel
-      heightField: null,
-      heightDomain: [0, 1],
-      heightScale: 'linear',
-
-      // add stroke color visual channel
-      strokeColorField: null,
-      strokeColorDomain: [0, 1],
-      strokeColorScale: 'quantile'
-    };
-  }
-
-  static findDefaultLayerProps({fields = []}) {
-    const foundColumns = this.findDefaultColumnField(S2_TOKEN_FIELDS, fields);
-    if (!foundColumns || !foundColumns.length) {
-      return {props: []};
-    }
-
-    return {
-      props: foundColumns.map(columns => ({
-        isVisible: true,
-        label: 'S2',
-        columns
-      }))
-    };
-  }
-
-  calculateDataAttribute({dataContainer, filteredIndex}, getS2Token) {
-    const data = [];
-    for (let i = 0; i < filteredIndex.length; i++) {
-      const index = filteredIndex[i];
-      const token = getS2Token({index});
-
-      if (token) {
-        data.push({
-          index,
-          token
-        });
-      }
-    }
-    return data;
-  }
-
-  updateLayerMeta(dataContainer, getS2Token) {
-    // add safe row flag
-    const centroids = dataContainer.reduce(
-      (acc, entry, index) => {
-        const s2Token = getS2Token({index});
-        if (s2Token) {
-          acc.push(getS2Center(s2Token));
-        }
-        return acc;
-      },
-      [],
-      true
-    );
-
-    const centroidsDataContainer = createDataContainer(centroids);
-    const bounds = this.getPointsBounds(centroidsDataContainer, (d, dc) => [
-      dc.valueAt(d.index, 0),
-      dc.valueAt(d.index, 1)
-    ]);
-    this.dataToFeature = {centroids};
-    this.updateMeta({bounds});
-  }
-
-  formatLayerData(datasets, oldLayerData, opt = {}) {
-    const {gpuFilter, dataContainer} = datasets[this.config.dataId];
-    const getS2Token = this.getPositionAccessor(dataContainer);
-    const {data} = this.updateData(datasets, oldLayerData);
-
-    const accessors = this.getAttributeAccessors({dataContainer});
-
-    return {
-      data,
-      getS2Token,
-      getFilterValue: gpuFilter.filterValueAccessor(dataContainer)(),
-      ...accessors
-    };
-  }
-
-  renderLayer(opts) {
-    const {data, gpuFilter, interactionConfig} = opts;
-
-    const defaultLayerProps = this.getDefaultDeckLayerProps(opts);
-    const {config} = this;
-    const {visConfig} = config;
-
-    const updateTriggers = {
-      ...this.getVisualChannelUpdateTriggers(),
-      getFilterValue: gpuFilter.filterValueUpdateTriggers
-    };
-
-    return [
-      new S2Layer({
-        ...defaultLayerProps,
-        ...interactionConfig,
-        ...data,
-        getS2Token: d => d.token,
-
-        autoHighlight: visConfig.enable3d,
-        highlightColor: HIGHLIGH_COLOR_3D,
-
-        // stroke
-        lineWidthScale: visConfig.thickness,
-        stroked: visConfig.stroked,
-        lineMiterLimit: 2,
-
-        // Filled color
-        filled: visConfig.filled,
-        opacity: visConfig.opacity,
-        wrapLongitude: false,
-
-        // Elevation
-        elevationScale: visConfig.elevationScale,
-        extruded: visConfig.enable3d,
-
-        wireframe: visConfig.wireframe,
-
-        pickable: true,
-
-        updateTriggers
-      })
-    ];
-  }
-}

package/src/layers/s2-geometry-layer/s2-utils.js

@@ -1,36 +0,0 @@
-// Copyright (c) 2022 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 Long from 'long';
-import {S2} from 's2-geometry';
-
-const MAXIMUM_TOKEN_LENGTH = 16;
-
-/**
- * Retrieve S2 geometry center
- * @param s2Token string | number
- * @return {*[]}
- */
-export function getS2Center(s2Token) {
-  const paddedToken = s2Token.toString().padEnd(MAXIMUM_TOKEN_LENGTH, '0');
-  const s2Id = Long.fromString(paddedToken, MAXIMUM_TOKEN_LENGTH);
-  const {lat, lng} = S2.idToLatLng(s2Id.toString());
-  return [lng, lat];
-}