CARTO module @deck.gl/carto #4925

alasarr · 2020-09-08T20:55:24Z

Background

Deck.gl is today the preferred/official library for CARTO to build Location Intelligence apps. We consider that the best option for the future is to be part of Deck.gl family and we've created @deck.gl/carto for this 😄 .

Why a module inside deck.gl repo? It's a more collaborative approach. The closer to Deck.gl, the better. We want our engineers in this ecosystem rather than working on a wrapper or an external module.

We've included some examples at examples/carto but was not clear for us to find the right place. Feel free to suggest another location even if you consider it shouldn't be part of this repo.

This module provides two layers:

CartoSQLLayer: is a layer to visualize data hosted in your CARTO account and apply custom SQL.
CartoBQTilerLayer: is a layer to visualize large datasets (millions or billions rows) directly from Google BigQuery without having to move data outside BigQuery. You need first to generate a tileset of your dataset in your BigQuery account using CARTO BigQuery Tiler. More info here.

Change List

A new module at modules/carto
Examples doc at examples/carto
Tests at test/modules/carto
Doc at docs/api-reference/carto
It includes doc at website

coveralls · 2020-09-08T21:10:21Z

Coverage decreased (-2.9%) to 80.678% when pulling ce74dcf on CartoDB:carto-module into e0cd727 on visgl:master.

alasarr · 2020-09-15T13:30:24Z

Examples moved to examples/get-started

Pessimistress · 2020-09-21T19:35:20Z

examples/get-started/pure-js/carto/README.md

@@ -0,0 +1,8 @@
+Pure js demo for CARTO layers
+
+### Usage


This demo requires a Mapbox token. Either add instructions for acquiring and providing a token (see README of other mapbox examples), or remove the mapbox dependency (preferred for a "minimal" example)

Not really since we're using CARTO's basemaps and they are free

Remove the mapbox code in this example then?

We still use Mapbox GL but tiles are provided by CARTO, so I think we can use Mapbox GL without a token.

Do you prefer to have the example without the basemap to make it simpler? I just did because it looks better with the basemap

I see, it's fine then

Pessimistress · 2020-09-21T19:41:56Z

examples/get-started/scripting/carto/index.html

+<html>
+  <head>
+    <!-- deck.gl standalone bundle -->
+    <script src="https://unpkg.com/deck.gl@^8.1.0/dist.min.js"></script>


You will need to include the carto module from CDN here.

As the number of submodules grow, we have paused adding new modules into the main bundle to prevent bloating its size with unnecessary functionalities, unless it can be justified for most common use cases. For example, the arcgis module is not part of the main bundle.

Done. I've kept it linked against ^8.1.0 just to allow an easy replace 😄

Pessimistress · 2020-09-21T19:45:07Z

modules/carto/package.json

+    "prepublishOnly": "npm run build-bundle && npm run build-bundle -- --env.dev"
+  },
+  "dependencies": {
+    "@deck.gl/geo-layers": "^8.2.7",


This should be a peerDependency

Pessimistress · 2020-09-21T19:45:49Z

docs/api-reference/carto/overview.md

+```bash
+npm install deck.gl
+# or
+npm install @deck.gl/core @deck.gl/layers @deck.gl/carto


Pessimistress · 2020-09-21T19:46:40Z

docs/api-reference/carto/overview.md

+## Install package
+
+```bash
+npm install deck.gl


For this to work the new module must be added to modules/main's package.json

Since we're not going to include in the bundle I think it's clearer to keep it outside the main module. Let me know otherwise.

deck.gl can include all submodules as dependency. This makes installation easier and has no direct impact on bundle size unless the user references a specific API.

Pessimistress · 2020-09-21T22:46:29Z

docs/api-reference/carto/carto-bqtiler-layer.md

+To use pre-bundled scripts:
+
+```html
+<script src="https://unpkg.com/deck.gl@^8.2.0/dist.min.js"></script>


Add carto bundle

Pessimistress · 2020-09-21T22:46:38Z

docs/api-reference/carto/carto-sql-layer.md

+To use pre-bundled scripts:
+
+```html
+<script src="https://unpkg.com/deck.gl@^8.2.0/dist.min.js"></script>


Add carto bundle

Pessimistress · 2020-09-21T22:48:40Z

docs/api-reference/carto/carto-sql-layer.md

+Optional. A string pointing to a unique attribute at the result of the query. A unique attribute is needed for highlighting a feature split across two or more tiles.
+
+
+##### `credentials` (Object)


Is this the equivalent of using setDefaultCredentials?

It's the same but for each layer. It's there to support layers from different CARTO users, so you can merge in the same map datasets of two users. It's quite common when you use a public dataset with a private one.

Pessimistress · 2020-09-21T22:52:28Z

modules/carto/src/layers/carto-bqtiler-layer.js

+const BQ_TILEJSON_ENDPOINT = 'https://us-central1-cartobq.cloudfunctions.net/tilejson';
+
+const defaultProps = {
+  ...CartoLayer.defaultProps


This is unnecessary. defaultProps is automatically merged with that of the parent class.

Pessimistress · 2020-09-21T22:57:25Z

modules/carto/src/layers/carto-layer.js

+  }
+
+  renderLayers() {
+    if (!this.state.tilejson) return [];


return null is fine

Pessimistress · 2020-09-21T22:59:20Z

modules/carto/src/layers/carto-layer.js

+      data: this.state.tilejson.tiles
+    };
+
+    return new MVTLayer(props);


This is more efficient:

new MVTLayer(this.props, this.getSubLayerProps({ id: 'mvt', data: this.state.tilejson.tiles }));

Pessimistress · 2020-09-21T22:59:47Z

modules/carto/src/layers/carto-sql-layer.js

+
+const defaultProps = {
+  ...mapsApiProps,
+  ...CartoLayer.defaultProps,


alasarr · 2020-09-22T13:59:33Z

Changes applied 😄

Pessimistress · 2020-09-23T20:35:39Z

docs/api-reference/carto/carto-bqtiler-layer.md

+
+<!-- or -->
+<script src="https://unpkg.com/@deck.gl/core@^8.0.0/dist.min.js"></script>
+<script src="https://unpkg.com/@deck.gl/layers@^8.2.0/dist.min.js"></script>


Missing geo-layers

Pessimistress · 2020-09-23T20:35:51Z

docs/api-reference/carto/carto-sql-layer.md

+
+<!-- or -->
+<script src="https://unpkg.com/@deck.gl/core@^8.0.0/dist.min.js"></script>
+<script src="https://unpkg.com/@deck.gl/layers@^8.2.0/dist.min.js"></script>


Missing geo-layers

Co-authored-by: Víctor Velarde <victor.velarde@gmail.com> Co-authored-by: Javier Aragón <jaragon@cartodb.com>

alasarr · 2020-09-24T16:08:34Z

I closed by mistake sorry

Pessimistress reviewed Sep 21, 2020

View reviewed changes

Pessimistress approved these changes Sep 21, 2020

View reviewed changes

Pessimistress approved these changes Sep 23, 2020

View reviewed changes

alasarr closed this Sep 24, 2020

Add carto module to integrate with CARTO backend

ce74dcf

Co-authored-by: Víctor Velarde <victor.velarde@gmail.com> Co-authored-by: Javier Aragón <jaragon@cartodb.com>

alasarr reopened this Sep 24, 2020

Pessimistress merged commit f1a9167 into visgl:master Sep 24, 2020

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

CARTO module @deck.gl/carto #4925

CARTO module @deck.gl/carto #4925

alasarr commented Sep 8, 2020 •

edited

Loading

coveralls commented Sep 8, 2020 •

edited

Loading

alasarr commented Sep 15, 2020

Pessimistress Sep 21, 2020

alasarr Sep 21, 2020 •

edited

Loading

Pessimistress Sep 21, 2020

alasarr Sep 21, 2020

alasarr Sep 21, 2020

Pessimistress Sep 21, 2020

Pessimistress Sep 21, 2020

alasarr Sep 21, 2020

Pessimistress Sep 21, 2020

Pessimistress Sep 21, 2020

Pessimistress Sep 21, 2020

alasarr Sep 21, 2020

Pessimistress Sep 21, 2020

alasarr Sep 21, 2020

Pessimistress Sep 21, 2020

Pessimistress Sep 21, 2020

Pessimistress Sep 21, 2020

alasarr Sep 22, 2020

Pessimistress Sep 21, 2020

Pessimistress Sep 21, 2020

Pessimistress Sep 21, 2020

Pessimistress Sep 21, 2020

alasarr commented Sep 22, 2020

Pessimistress Sep 23, 2020

Pessimistress Sep 23, 2020

alasarr commented Sep 24, 2020

		Optional. A string pointing to a unique attribute at the result of the query. A unique attribute is needed for highlighting a feature split across two or more tiles.


		##### `credentials` (Object)

CARTO module @deck.gl/carto #4925

CARTO module @deck.gl/carto #4925

Conversation

alasarr commented Sep 8, 2020 • edited Loading

Background

Change List

coveralls commented Sep 8, 2020 • edited Loading

alasarr commented Sep 15, 2020

Choose a reason for hiding this comment

alasarr Sep 21, 2020 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

alasarr commented Sep 22, 2020

Choose a reason for hiding this comment

Choose a reason for hiding this comment

alasarr commented Sep 24, 2020

alasarr commented Sep 8, 2020 •

edited

Loading

coveralls commented Sep 8, 2020 •

edited

Loading

alasarr Sep 21, 2020 •

edited

Loading