Skip to content

Instantly share code, notes, and snippets.

View makella's full-sized avatar

Mamata Akella makella

View GitHub Profile
@makella
makella / filters.md
Last active February 5, 2024 22:47
protomaps.js styling filters

A place to collect handy tips and tricks for style-based filters

Simple color by type

In this case, there are multiple types filtered from the same layer. I want to assign each type a unique color.

Try 1: fail

If/else conditions with a fallback. (following this example)

  {
    dataLayer: `admin`,
@makella
makella / index.html
Created July 2, 2020 16:26
steph house congrats!
<!DOCTYPE html>
<html>
<head>
<title>Congrats on the house!</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<script src="https://libs.cartocdn.com/carto-vl/v1.1.1/carto-vl.min.js"></script>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.js"></script>
<link href="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.css" rel="stylesheet" />
@makella
makella / index.html
Last active July 2, 2020 16:17
steph house
<!DOCTYPE html>
<html>
<head>
<title>Congrats on the house!</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<script src="https://libs.cartocdn.com/carto-vl/v1.1.1/carto-vl.min.js"></script>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.js"></script>
<link href="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.css" rel="stylesheet" />
@makella
makella / index.html
Last active July 2, 2020 17:46
jonah congrats
<!DOCTYPE html>
<html>
<head>
<title>Congrats on the new job!</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<script src="https://libs.cartocdn.com/carto-vl/v1.1.1/carto-vl.min.js"></script>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.js"></script>
<link href="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.css" rel="stylesheet" />
@makella
makella / index.html
Created February 26, 2020 21:17
Locations Attendees
<!DOCTYPE html>
<html>
<head>
<title>Exported map | CARTO VL</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<script src="http://libs.cartocdn.com/carto-vl/v1.4.4/carto-vl.js"></script>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v1.0.0/mapbox-gl.js"></script>
<link href="https://api.tiles.mapbox.com/mapbox-gl-js/v1.0.0/mapbox-gl.css" rel="stylesheet" />
<style>
@makella
makella / readme.md
Last active November 5, 2019 18:41
Equal Earth Projection in CARTO

Equal Earth Projection in CARTO!

Screen Shot 2019-11-05 at 11 31 42 AM

The recent release of PostGIS 3.0 brings an updated spatial reference system table that includes over 8000 projections out of the box and we're happy to report that the Equal Earth Projection is one of them!

As a CARTO user, this means you can start using this popular projection in your maps right away!

Getting Started

@makella
makella / index.html
Last active November 4, 2019 22:17
Equal Earth CARTO VL
<!DOCTYPE html>
<html>
<head>
<title>Equal Earth | CARTO</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<script src="https://libs.cartocdn.com/carto-vl/v1.4.2/carto-vl.min.js"></script>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v1.0.0/mapbox-gl.js"></script>
<link href="https://api.tiles.mapbox.com/mapbox-gl-js/v1.0.0/mapbox-gl.css" rel="stylesheet" />
<link href="https://carto.com/developers/carto-vl/v1.4.2/examples/maps/style.css" rel="stylesheet">
@makella
makella / index.html
Created May 22, 2019 22:37
Webinar SF Crime Reports 2019
<!DOCTYPE html>
<html>
<head>
<title>Label clusters by count | CARTO VL</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://libs.cartocdn.com/carto-vl/v1.2.5/carto-vl.min.js"></script>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.js"></script>
<link href="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.css" rel="stylesheet" />
<link href="https://carto.com/developers/carto-vl/v1.2.5/examples/maps/style.css" rel="stylesheet">
@makella
makella / index.html
Created May 21, 2019 10:40
Webinar: Pittsburgh 311 Incidents Clustered
<!DOCTYPE html>
<html>
<head>
<title>Label clusters by count | CARTO VL</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://libs.cartocdn.com/carto-vl/v1.2.5/carto-vl.min.js"></script>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.js"></script>
<link href="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.css" rel="stylesheet" />
<link href="https://carto.com/developers/carto-vl/v1.2.5/examples/maps/style.css" rel="stylesheet">
@makella
makella / index.html
Last active March 1, 2019 22:25
weekend weather
<!DOCTYPE html>
<html>
<head>
<title>Weekend precipitation | CARTO</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<script src="https://libs.cartocdn.com/carto-vl/v1.1.1/carto-vl.min.js"></script>
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.js"></script>
<link href="https://api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.css" rel="stylesheet" />