@carto/kepler.gl 0.0.31-alpha.0 → 0.0.32-alpha1

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

@@ -247,14 +247,11 @@ export default class IconLayer extends Layer {
   renderLayer(opts) {
     const {data, gpuFilter, objectHovered, mapState, interactionConfig} = opts;
 
-    const fixedRadius = this.config.visConfig.fixedRadius && Boolean(this.config.sizeField);
-    const radiusScale = this.getRadiusScale(fixedRadius);
-    const radiusUnits = this.getRadiusUnit(fixedRadius);
+    const radiusScale = this.getRadiusScaleByZoom(mapState);
 
     const layerProps = {
       radiusScale,
-      radiusUnits,
-      ...(fixedRadius ? {} : {radiusMaxPixels: 500})
+      ...(this.config.visConfig.fixedRadius ? {} : {radiusMaxPixels: 500})
     };
 
     const updateTriggers = {
@@ -265,12 +262,7 @@ export default class IconLayer extends Layer {
 
     const defaultLayerProps = this.getDefaultDeckLayerProps(opts);
     const brushingProps = this.getBrushingExtensionProps(interactionConfig);
-    const getPixelOffset = getTextOffsetByRadius(
-      radiusScale,
-      data.getRadius,
-      mapState,
-      fixedRadius
-    );
+    const getPixelOffset = getTextOffsetByRadius(radiusScale, data.getRadius, mapState);
     const extensions = [...defaultLayerProps.extensions, brushingExtension];
 
     // shared Props between layer and label layer

package/src/layers/layer-factory.js

@@ -111,7 +111,7 @@ export const LAYER_VIS_CONFIGS = {
   // radius is actually radiusScale in deck.gl
   radius: {
     type: 'number',
-    defaultValue: 2,
+    defaultValue: 10,
     label: 'layerVisConfigs.radius',
     isRanged: false,
     range: [0, 100],

package/src/layers/layer-text-label.js

@@ -24,7 +24,7 @@ import uniq from 'lodash.uniq';
 
 export const defaultPadding = 20;
 
-export function getTextOffsetByRadius(radiusScale, getRadius, mapState, fixedRadius) {
+export function getTextOffsetByRadius(radiusScale, getRadius, mapState) {
   return textLabel => {
     const distanceScale = getDistanceScales(mapState);
     const xMult = textLabel.anchor === 'middle' ? 0 : textLabel.anchor === 'start' ? 1 : -1;
@@ -37,7 +37,7 @@ export function getTextOffsetByRadius(radiusScale, getRadius, mapState, fixedRad
         ? textLabel.size
         : textLabel.size;
 
-    const pixelRadius = fixedRadius ? radiusScale * distanceScale.pixelsPerMeter[0] : radiusScale;
+    const pixelRadius = radiusScale * distanceScale.pixelsPerMeter[0];
     const padding = defaultPadding;
 
     return typeof getRadius === 'function'

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

@@ -242,8 +242,7 @@ export default class PointLayer extends Layer {
 
     // if no field size is defined we need to pass fixed radius = false
     const fixedRadius = this.config.visConfig.fixedRadius && Boolean(this.config.sizeField);
-    const radiusScale = this.getRadiusScale(fixedRadius);
-    const radiusUnits = this.getRadiusUnit(fixedRadius);
+    const radiusScale = this.getRadiusScaleByZoom(mapState, fixedRadius);
 
     const layerProps = {
       stroked: this.config.visConfig.outline,
@@ -261,12 +260,7 @@ export default class PointLayer extends Layer {
 
     const defaultLayerProps = this.getDefaultDeckLayerProps(opts);
     const brushingProps = this.getBrushingExtensionProps(interactionConfig);
-    const getPixelOffset = getTextOffsetByRadius(
-      radiusScale,
-      data.getRadius,
-      mapState,
-      fixedRadius
-    );
+    const getPixelOffset = getTextOffsetByRadius(radiusScale, data.getRadius, mapState);
     const extensions = [...defaultLayerProps.extensions, brushingExtension];
 
     const sharedProps = {
@@ -288,7 +282,6 @@ export default class PointLayer extends Layer {
           // circles will be flat on the map when the altitude column is not used
           depthTest: this.config.columns.altitude?.fieldIdx > -1
         },
-        radiusUnits,
         lineWidthUnits: 'pixels',
         updateTriggers,
         extensions

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

@@ -278,8 +278,7 @@ export default class TripLayer extends Layer {
         ...defaultLayerProps,
         ...data,
         getTimestamps: d => data.getTimestamps(d).map(ts => ts - domain0),
-        widthScale: this.config.visConfig.thickness,
-        widthUnits: 'pixels',
+        widthScale: this.config.visConfig.thickness * zoomFactor * zoomFactorValue,
         rounded: true,
         wrapLongitude: false,
         parameters: {

package/src/reducers/vis-state-merger.js

@@ -146,9 +146,9 @@ export function insertLayerAtRightOrder(
     if (expectedIdx > 0) {
       // look for layer to insert after
       let i = expectedIdx + 1;
-      let preceedIdx = null;
-      while (i-- > 0 && preceedIdx === null) {
-        const preceedLayer = preservedOrder[expectedIdx - 1];
+      let preceedIdx = -1;
+      while (i-- > 0 && preceedIdx === -1) {
+        const preceedLayer = preservedOrder[i];
         preceedIdx = layerOrderQueue.indexOf(preceedLayer);
       }