@deck.gl/carto 9.0.0-beta.2 → 9.0.0-beta.3

package/dist/api/parse-map.js

@@ -0,0 +1,250 @@
+import { GL } from '@luma.gl/constants';
+import { log } from '@deck.gl/core';
+import { AGGREGATION, getLayer, getColorAccessor, getColorValueAccessor, getSizeAccessor, getTextAccessor, OPACITY_MAP, opacityToAlpha, getIconUrlAccessor, negateAccessor, getMaxMarkerSize } from "./layer-map.js";
+import PointLabelLayer from "../layers/point-label-layer.js";
+import { CollisionFilterExtension } from '@deck.gl/extensions';
+import { assert } from "../utils.js";
+const collisionFilterExtension = new CollisionFilterExtension();
+export function parseMap(json) {
+    const { keplerMapConfig, datasets, token } = json;
+    assert(keplerMapConfig.version === 'v1', 'Only support Kepler v1');
+    const { mapState, mapStyle } = keplerMapConfig.config;
+    const { layers, layerBlending, interactionConfig } = keplerMapConfig.config.visState;
+    return {
+        id: json.id,
+        title: json.title,
+        description: json.description,
+        createdAt: json.createdAt,
+        updatedAt: json.updatedAt,
+        initialViewState: mapState,
+        mapStyle,
+        token,
+        layers: layers.reverse().map(({ id, type, config, visualChannels }) => {
+            try {
+                const { dataId } = config;
+                const dataset = datasets.find(d => d.id === dataId);
+                assert(dataset, `No dataset matching dataId: ${dataId}`);
+                const { data } = dataset;
+                assert(data, `No data loaded for dataId: ${dataId}`);
+                const { Layer, propMap, defaultProps } = getLayer(type, config, dataset);
+                const styleProps = createStyleProps(config, propMap);
+                return new Layer({
+                    id,
+                    data,
+                    ...defaultProps,
+                    ...createInteractionProps(interactionConfig),
+                    ...styleProps,
+                    ...createChannelProps(id, type, config, visualChannels, data), // Must come after style
+                    ...createParametersProp(layerBlending, styleProps.parameters || {}), // Must come after style
+                    ...createLoadOptions(token)
+                });
+            }
+            catch (e) {
+                log.error(e.message)();
+                return undefined;
+            }
+        })
+    };
+}
+function createParametersProp(layerBlending, parameters) {
+    if (layerBlending === 'additive') {
+        parameters.blendFunc = [GL.SRC_ALPHA, GL.DST_ALPHA];
+        parameters.blendEquation = GL.FUNC_ADD;
+    }
+    else if (layerBlending === 'subtractive') {
+        parameters.blendFunc = [GL.ONE, GL.ONE_MINUS_DST_COLOR, GL.SRC_ALPHA, GL.DST_ALPHA];
+        parameters.blendEquation = [GL.FUNC_SUBTRACT, GL.FUNC_ADD];
+    }
+    return Object.keys(parameters).length ? { parameters } : {};
+}
+function createInteractionProps(interactionConfig) {
+    const pickable = interactionConfig && interactionConfig.tooltip.enabled;
+    return {
+        autoHighlight: pickable,
+        pickable
+    };
+}
+function mapProps(source, target, mapping) {
+    for (const sourceKey in mapping) {
+        const sourceValue = source[sourceKey];
+        const targetKey = mapping[sourceKey];
+        if (sourceValue === undefined) {
+            // eslint-disable-next-line no-continue
+            continue;
+        }
+        if (typeof targetKey === 'string') {
+            target[targetKey] = sourceValue;
+        }
+        else if (typeof targetKey === 'function') {
+            const [key, value] = Object.entries(targetKey(sourceValue))[0];
+            target[key] = value;
+        }
+        else if (typeof targetKey === 'object') {
+            // Nested definition, recurse down one level (also handles arrays)
+            mapProps(sourceValue, target, targetKey);
+        }
+    }
+}
+function createStyleProps(config, mapping) {
+    const result = {};
+    mapProps(config, result, mapping);
+    // Kepler format sometimes omits strokeColor. TODO: remove once we can rely on
+    // `strokeColor` always being set when `stroke: true`.
+    if (result.stroked && !result.getLineColor) {
+        result.getLineColor = result.getFillColor;
+    }
+    for (const colorAccessor in OPACITY_MAP) {
+        if (Array.isArray(result[colorAccessor])) {
+            const color = [...result[colorAccessor]];
+            const opacityKey = OPACITY_MAP[colorAccessor];
+            const opacity = config.visConfig[opacityKey];
+            color[3] = opacityToAlpha(opacity);
+            result[colorAccessor] = color;
+        }
+    }
+    result.highlightColor = config.visConfig.enable3d ? [255, 255, 255, 60] : [252, 242, 26, 255];
+    return result;
+}
+/* eslint-disable complexity, max-statements */
+function createChannelProps(id, type, config, visualChannels, data) {
+    const { colorField, colorScale, radiusField, radiusScale, sizeField, sizeScale, strokeColorField, strokeColorScale } = visualChannels;
+    let { heightField, heightScale } = visualChannels;
+    if (type === 'hexagonId') {
+        heightField = sizeField;
+        heightScale = sizeScale;
+    }
+    const { textLabel, visConfig } = config;
+    const result = {};
+    if (type === 'grid' || type === 'hexagon') {
+        result.colorScaleType = colorScale;
+        if (colorField) {
+            const { colorAggregation } = config.visConfig;
+            if (!AGGREGATION[colorAggregation]) {
+                result.getColorValue = getColorValueAccessor(colorField, colorAggregation, data);
+            }
+            else {
+                result.getColorWeight = d => d[colorField.name];
+            }
+        }
+    }
+    else if (colorField) {
+        const { colorAggregation: aggregation, colorRange: range } = visConfig;
+        result.getFillColor = getColorAccessor(colorField, 
+        // @ts-ignore
+        colorScale, { aggregation, range }, visConfig.opacity, data);
+    }
+    if (type === 'point') {
+        const altitude = config.columns?.altitude;
+        if (altitude) {
+            result.dataTransform = data => {
+                data.features.forEach(({ geometry, properties }) => {
+                    const { type, coordinates } = geometry;
+                    if (type === 'Point') {
+                        coordinates[2] = properties[altitude];
+                    }
+                });
+                return data;
+            };
+        }
+    }
+    if (radiusField || sizeField) {
+        result.getPointRadius = getSizeAccessor(
+        // @ts-ignore
+        radiusField || sizeField, 
+        // @ts-ignore
+        radiusScale || sizeScale, visConfig.sizeAggregation, visConfig.radiusRange || visConfig.sizeRange, data);
+    }
+    if (strokeColorField) {
+        const fallbackOpacity = type === 'point' ? visConfig.opacity : 1;
+        const opacity = visConfig.strokeOpacity !== undefined ? visConfig.strokeOpacity : fallbackOpacity;
+        const { strokeColorAggregation: aggregation, strokeColorRange: range } = visConfig;
+        result.getLineColor = getColorAccessor(strokeColorField, 
+        // @ts-ignore
+        strokeColorScale, 
+        // @ts-ignore
+        { aggregation, range }, opacity, data);
+    }
+    if (heightField && visConfig.enable3d) {
+        result.getElevation = getSizeAccessor(heightField, 
+        // @ts-ignore
+        heightScale, visConfig.heightAggregation, visConfig.heightRange || visConfig.sizeRange, data);
+    }
+    if (visConfig.customMarkers) {
+        const maxIconSize = getMaxMarkerSize(visConfig, visualChannels);
+        const { getPointRadius, getFillColor } = result;
+        const { customMarkersUrl, customMarkersRange, filled: useMaskedIcons } = visConfig;
+        result.pointType = 'icon';
+        result.getIcon = getIconUrlAccessor(visualChannels.customMarkersField, customMarkersRange, { fallbackUrl: customMarkersUrl, maxIconSize, useMaskedIcons }, data);
+        result._subLayerProps = {
+            'points-icon': {
+                loadOptions: {
+                    image: {
+                        type: 'imagebitmap'
+                    },
+                    imagebitmap: {
+                        resizeWidth: maxIconSize,
+                        resizeHeight: maxIconSize,
+                        resizeQuality: 'high'
+                    }
+                }
+            }
+        };
+        if (getFillColor && useMaskedIcons) {
+            result.getIconColor = getFillColor;
+        }
+        if (getPointRadius) {
+            result.getIconSize = getPointRadius;
+        }
+        if (visualChannels.rotationField) {
+            result.getIconAngle = negateAccessor(getSizeAccessor(visualChannels.rotationField, undefined, null, undefined, data));
+        }
+    }
+    else if (type === 'point' || type === 'tileset') {
+        result.pointType = 'circle';
+    }
+    if (textLabel && textLabel.length && textLabel[0].field) {
+        const [mainLabel, secondaryLabel] = textLabel;
+        const collisionGroup = id;
+        ({
+            alignment: result.getTextAlignmentBaseline,
+            anchor: result.getTextAnchor,
+            color: result.getTextColor,
+            outlineColor: result.textOutlineColor,
+            size: result.textSizeScale
+        } = mainLabel);
+        const { color: getSecondaryColor, field: secondaryField, outlineColor: secondaryOutlineColor, size: secondarySizeScale } = secondaryLabel || {};
+        result.getText = mainLabel.field && getTextAccessor(mainLabel.field, data);
+        const getSecondaryText = secondaryField && getTextAccessor(secondaryField, data);
+        result.pointType = `${result.pointType}+text`;
+        result.textCharacterSet = 'auto';
+        result.textFontFamily = 'Inter, sans';
+        result.textFontSettings = { sdf: true };
+        result.textFontWeight = 600;
+        result.textOutlineWidth = 3;
+        result._subLayerProps = {
+            ...result._subLayerProps,
+            'points-text': {
+                type: PointLabelLayer,
+                extensions: [collisionFilterExtension],
+                collisionEnabled: true,
+                collisionGroup,
+                // getPointRadius already has radiusScale baked in, so only pass one or the other
+                ...(result.getPointRadius
+                    ? { getRadius: result.getPointRadius }
+                    : { radiusScale: visConfig.radius }),
+                ...(secondaryField && {
+                    getSecondaryText,
+                    getSecondaryColor,
+                    secondarySizeScale,
+                    secondaryOutlineColor
+                })
+            }
+        };
+    }
+    return result;
+}
+function createLoadOptions(accessToken) {
+    return {
+        loadOptions: { fetch: { headers: { Authorization: `Bearer ${accessToken}` } } }
+    };
+}

package/dist/api/query.js

@@ -0,0 +1,24 @@
+import { SOURCE_DEFAULTS } from "../sources/index.js";
+import { buildQueryUrl } from "./endpoints.js";
+import { requestWithParameters } from "./request-with-parameters.js";
+export const query = async function (options) {
+    const { apiBaseUrl = SOURCE_DEFAULTS.apiBaseUrl, connectionName, sqlQuery, queryParameters } = options;
+    const urlParameters = { q: sqlQuery };
+    if (queryParameters) {
+        urlParameters.queryParameters = JSON.stringify(queryParameters);
+    }
+    const baseUrl = buildQueryUrl({ apiBaseUrl, connectionName });
+    const headers = { Authorization: `Bearer ${options.accessToken}`, ...options.headers };
+    const errorContext = {
+        requestType: 'SQL',
+        connection: options.connectionName,
+        type: 'query',
+        source: JSON.stringify(urlParameters, undefined, 2)
+    };
+    return await requestWithParameters({
+        baseUrl,
+        parameters: urlParameters,
+        headers,
+        errorContext
+    });
+};

package/dist/api/request-with-parameters.js

@@ -0,0 +1,53 @@
+import { CartoAPIError } from "./carto-api-error.js";
+import { DEFAULT_HEADERS, DEFAULT_PARAMETERS, MAX_GET_LENGTH } from "./common.js";
+/**
+ * Simple encode parameter
+ */
+function encodeParameter(name, value) {
+    return `${name}=${encodeURIComponent(value)}`;
+}
+const REQUEST_CACHE = new Map();
+export async function requestWithParameters({ accessToken, baseUrl, parameters, headers: customHeaders, errorContext }) {
+    const key = JSON.stringify({ baseUrl, parameters, customHeaders });
+    if (REQUEST_CACHE.has(key)) {
+        return REQUEST_CACHE.get(key);
+    }
+    let url = baseUrl;
+    if (parameters) {
+        const allParameters = { ...DEFAULT_PARAMETERS, ...parameters };
+        const encodedParameters = Object.entries(allParameters).map(([key, value]) => {
+            return encodeParameter(key, value);
+        });
+        url += `?${encodedParameters.join('&')}`;
+    }
+    const headers = { ...DEFAULT_HEADERS, ...customHeaders };
+    try {
+        /* global fetch */
+        let response;
+        if (url.length > MAX_GET_LENGTH) {
+            response = await fetch(baseUrl, { method: 'POST', body: JSON.stringify(parameters), headers });
+        }
+        else {
+            response = await fetch(url, { headers });
+        }
+        let json;
+        try {
+            json = await response.json();
+            if (accessToken) {
+                json.accessToken = accessToken;
+            }
+        }
+        catch {
+            json = { error: '' };
+        }
+        if (!response.ok) {
+            REQUEST_CACHE.delete(key);
+            throw new CartoAPIError(json.error, errorContext, response);
+        }
+        REQUEST_CACHE.set(key, json);
+        return json;
+    }
+    catch (error) {
+        throw new CartoAPIError(error, errorContext);
+    }
+}

package/dist/api/types.js

@@ -0,0 +1,12 @@
+export var SchemaFieldType;
+(function (SchemaFieldType) {
+    SchemaFieldType["Number"] = "number";
+    SchemaFieldType["Bigint"] = "bigint";
+    SchemaFieldType["String"] = "string";
+    SchemaFieldType["Geometry"] = "geometry";
+    SchemaFieldType["Timestamp"] = "timestamp";
+    SchemaFieldType["Object"] = "object";
+    SchemaFieldType["Boolean"] = "boolean";
+    SchemaFieldType["Variant"] = "variant";
+    SchemaFieldType["Unknown"] = "unknown";
+})(SchemaFieldType || (SchemaFieldType = {}));

package/dist/basemap.js

@@ -0,0 +1,9 @@
+const baseUrl = 'https://basemaps.cartocdn.com/gl/{basemap}-gl-style/style.json';
+export default {
+    VOYAGER: baseUrl.replace('{basemap}', 'voyager'),
+    POSITRON: baseUrl.replace('{basemap}', 'positron'),
+    DARK_MATTER: baseUrl.replace('{basemap}', 'dark-matter'),
+    VOYAGER_NOLABELS: baseUrl.replace('{basemap}', 'voyager-nolabels'),
+    POSITRON_NOLABELS: baseUrl.replace('{basemap}', 'positron-nolabels'),
+    DARK_MATTER_NOLABELS: baseUrl.replace('{basemap}', 'dark-matter-nolabels')
+};

package/dist/cartoRasterTile-worker.js

@@ -1030,7 +1030,7 @@
   };
 
   // src/layers/schema/tile-loader-utils.ts
-  var import_pbf = __toESM(require_pbf());
+  var import_pbf = __toESM(require_pbf(), 1);
   function parsePbf(buffer, TileReader2) {
     const pbf = new import_pbf.default(buffer);
     const tile = TileReader2.read(pbf);
@@ -1043,7 +1043,7 @@
   }
 
   // src/layers/schema/carto-raster-tile-loader.ts
-  var VERSION = true ? "9.0.0-beta.2" : "latest";
+  var VERSION = true ? "9.0.0-beta.3" : "latest";
   var id = "cartoRasterTile";
   var DEFAULT_OPTIONS = {
     cartoRasterTile: {

package/dist/cartoSpatialTile-worker.js

@@ -758,9 +758,9 @@
     }
   });
 
-  // ../../../quadbin-js/node_modules/tilebelt/index.js
+  // ../../node_modules/tilebelt/index.js
   var require_tilebelt = __commonJS({
-    "../../../quadbin-js/node_modules/tilebelt/index.js"(exports, module) {
+    "../../node_modules/tilebelt/index.js"(exports, module) {
       var d2r = Math.PI / 180;
       var r2d = 180 / Math.PI;
       function tileToBBOX(tile) {
@@ -918,9 +918,9 @@
     }
   });
 
-  // ../../../quadbin-js/node_modules/@mapbox/tile-cover/index.js
+  // ../../node_modules/@mapbox/tile-cover/index.js
   var require_tile_cover = __commonJS({
-    "../../../quadbin-js/node_modules/@mapbox/tile-cover/index.js"(exports) {
+    "../../node_modules/@mapbox/tile-cover/index.js"(exports) {
       var tilebelt = require_tilebelt();
       exports.geojson = function(geom, limits) {
         return {
@@ -1395,7 +1395,7 @@
   };
 
   // src/layers/schema/tile-loader-utils.ts
-  var import_pbf = __toESM(require_pbf());
+  var import_pbf = __toESM(require_pbf(), 1);
   function parsePbf(buffer, TileReader2) {
     const pbf = new import_pbf.default(buffer);
     const tile = TileReader2.read(pbf);
@@ -1407,7 +1407,7 @@
     return `https://unpkg.com/@deck.gl/carto@${version}/dist/${id2}-worker.js`;
   }
 
-  // ../../../quadbin-js/dist/esm/index.js
+  // ../../node_modules/quadbin/dist/esm/index.js
   var import_tile_cover = __toESM(require_tile_cover(), 1);
   function bigIntToHex(index) {
     return index.toString(16);
@@ -1430,7 +1430,7 @@
   }
 
   // src/layers/schema/carto-spatial-tile-loader.ts
-  var VERSION = true ? "9.0.0-beta.2" : "latest";
+  var VERSION = true ? "9.0.0-beta.3" : "latest";
   var id = "cartoSpatialTile";
   var DEFAULT_OPTIONS = {
     cartoSpatialTile: {

package/dist/cartoVectorTile-worker.js

@@ -1439,7 +1439,7 @@
   }
 
   // src/layers/schema/carto-vector-tile-loader.ts
-  var import_earcut = __toESM(require_earcut());
+  var import_earcut = __toESM(require_earcut(), 1);
 
   // src/layers/schema/fast-pbf.ts
   function readPackedTypedArray(TypedArray, pbf, obj) {
@@ -1645,7 +1645,7 @@
   };
 
   // src/layers/schema/tile-loader-utils.ts
-  var import_pbf = __toESM(require_pbf());
+  var import_pbf = __toESM(require_pbf(), 1);
   function parsePbf(buffer, TileReader2) {
     const pbf = new import_pbf.default(buffer);
     const tile = TileReader2.read(pbf);
@@ -1658,7 +1658,7 @@
   }
 
   // src/layers/schema/carto-vector-tile-loader.ts
-  var VERSION = true ? "9.0.0-beta.2" : "latest";
+  var VERSION = true ? "9.0.0-beta.3" : "latest";
   var id = "cartoVectorTile";
   var DEFAULT_OPTIONS = {
     cartoVectorTile: {