Skip to content

Instantly share code, notes, and snippets.

View padawannn's full-sized avatar

Javier Aragón padawannn

14 followers · 0 following
View GitHub Profile
@padawannn
padawannn / index.html
Created September 11, 2020 07:46
deckgl-example-with-basemap-using-mapbox-custom-layers
<html>
<head>
<!-- deck.gl standalone bundle -->
<script src="https://unpkg.com/deck.gl@^8.2.8/dist.min.js"></script>
<!-- Mapbox dependencies -->
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v1.4.0/mapbox-gl.js"></script>
<link href="https://api.tiles.mapbox.com/mapbox-gl-js/v1.4.0/mapbox-gl.css" rel="stylesheet" />
<style type="text/css">
@padawannn
padawannn / index.html
Created September 11, 2020 07:42
deckgl-example-with-basemap
<html>
<head>
<!-- deck.gl standalone bundle -->
<script src="https://unpkg.com/deck.gl@^8.2.8/dist.min.js"></script>
<!-- Mapbox dependencies -->
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v1.4.0/mapbox-gl.js"></script>
<link href="https://api.tiles.mapbox.com/mapbox-gl-js/v1.4.0/mapbox-gl.css" rel="stylesheet" />
<style type="text/css">
body {margin: 0; padding: 0;}
@padawannn
padawannn / index.html
Created September 11, 2020 07:41
deckgl-example-without-basemap
<html>
<head>
<!-- deck.gl standalone bundle -->
<script src="https://unpkg.com/deck.gl@^8.1.0/dist.min.js"></script>
<style type="text/css">
body {margin: 0; padding: 0;}
#map {width: 100vw; height: 100vh;}
</style>
</head>
@padawannn
padawannn / carto_test_ios.md
Last active July 1, 2019 12:51

Traffic Lights Map

We want you to build an iOS app showing traffic lights according to a specific dataset. The app should show the traffic lights on a map according to their latitude and longitude. In addition, it should provide a list view of the lights. Finally, both screens should provide the option to filter the items according to some fields (be free to choose some of them) and to see the traffic lights within a specified area on the map. For example, a valid way to provide the area would be asking name of a street and the radius in meters.

Considerations

  • You are free to choose the specific map library to work on.
  • You have to develop an universal app for iOS 12, by using Swift.
  • The dataset is accessible through a GET over https://javieraragon.carto.com/api/v2/sql?q=SELECT id, direction, href, region, title, view, ST_X(the_geom) as longitude, ST_Y(the_geom) as latitude FROM ios_test. The query param q is used to pass a SQL query to extract the data from the dataset. Under the hood, it will
@padawannn
padawannn / carto-vl.js
Last active July 5, 2018 16:22
CARTO VL test 400 properties
/*!
* CARTO VL js https://carto.com/
* Version: 0.5.1
*
*/
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory();
else if(typeof define === 'function' && define.amd)
define([], factory);
@padawannn
padawannn / index.html
Created March 15, 2018 10:57
Carto-draw
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>MapboxGL CARTO Building</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.44.1/mapbox-gl.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.44.1/mapbox-gl.css' rel='stylesheet' />
<style>
body { margin:0; padding:0; }
@padawannn
padawannn / index.html
Created March 15, 2018 08:42
Carto-1M-points
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>MapboxGL CARTO Building</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.44.1/mapbox-gl.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.44.1/mapbox-gl.css' rel='stylesheet' />
<style>
body { margin:0; padding:0; }
@padawannn
padawannn / index.html
Created March 15, 2018 08:39
Carto-cluster
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>MapboxGL CARTO Building</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.44.1/mapbox-gl.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.44.1/mapbox-gl.css' rel='stylesheet' />
<style>
body { margin:0; padding:0; }
@padawannn
padawannn / index.html
Last active March 14, 2018 18:39
Carto-base-map-selector
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>MapboxGL CARTO Building</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.44.1/mapbox-gl.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.44.1/mapbox-gl.css' rel='stylesheet' />
<style>
body { margin:0; padding:0; }
@padawannn
padawannn / index.html
Last active August 14, 2018 14:50
HaCkARTO.js · 2017
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CARTO.js App</title>
<link href="https://fonts.googleapis.com/css?family=Fira+Sans:200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
<!-- Include Leaflet 1.2.0 Library -->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.2.0/dist/leaflet.js"></script>
<!-- Include cartodb.js Library -->