Last active
April 19, 2023 02:26
-
-
Save jjsantos01/9d10df889f105e8231f5375408b1c614 to your computer and use it in GitHub Desktop.
Muestra la disponibilidad de las estaciones del sistema Ecobici (CDMX) a lo largo del día 1 de octubre de 2019. https://www.youtube.com/watch?v=VoZeLesaLTo Los puntos rojos indican que una estación se quedó sin bicicletas disponibles al menos una vez durante los últimos 15 minutos. Los puntos verdes indican que la estación estuvo totalmente llen…
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>Disponibilidad estaciones</title> | |
| <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> | |
| <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> | |
| <link rel="shortcut icon" href="https://cartodb.com/assets/favicon.ico" /> | |
| <style> | |
| html, body, #map { | |
| height: 100%; | |
| padding: 0; | |
| margin: 0; | |
| } | |
| </style> | |
| <link rel="stylesheet" href="https://libs.cartocdn.com/cartodb.js/v3/themes/css/cartodb.css" /> | |
| <!--[if lte IE 8]> | |
| <link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/themes/css/cartodb.ie.css" /> | |
| <![endif]--> | |
| <script type="sql/html" id="cartocss_template"> | |
| /** torque_cat visualization */ | |
| Map { | |
| -torque-frame-count: 216; | |
| -torque-animation-duration: 15; | |
| -torque-time-attribute:"fecha_dt"; | |
| -torque-aggregation-function:"CDB_Math_Mode(estatus)"; | |
| -torque-resolution:2; | |
| -torque-data-aggregation:linear; | |
| } | |
| #cleveland_spring_points{ | |
| comp-op: source-over; | |
| marker-fill-opacity: 1; | |
| marker-line-color: #FFF; | |
| marker-line-width: 0; | |
| marker-line-opacity: 1; | |
| marker-type: ellipse; | |
| marker-width: 2; | |
| marker-fill: #f7fcfd; | |
| } | |
| #cleveland_spring_points[value=1] { | |
| marker-fill: #bd0026; | |
| marker-width: 8; | |
| marker-fill-opacity:0.75; | |
| } | |
| #cleveland_spring_points[value=2] { | |
| marker-fill: #006d2c; | |
| marker-width: 8; | |
| marker-fill-opacity:0.75; | |
| } | |
| #cleveland_spring_points[frame-offset=1] { | |
| marker-fill-opacity:0.25; | |
| } | |
| #cleveland_spring_points[frame-offset=2] { | |
| marker-fill-opacity:0.25; | |
| } | |
| #cleveland_spring_points[frame-offset=3] { | |
| marker-fill-opacity:0.25; | |
| } | |
| #cleveland_spring_points[frame-offset=4] { | |
| marker-fill-opacity:0.25; | |
| } | |
| </script> | |
| </head> | |
| <body> | |
| <div id="map"></div> | |
| <!-- include cartodb.js library --> | |
| <script src="https://libs.cartocdn.com/cartodb.js/v3/cartodb.js"></script> | |
| <script> | |
| function main() { | |
| var map = new L.Map('map', { | |
| zoomControl: true, | |
| center: [19.39756656, -99.18295811], | |
| zoom: 13, | |
| minZoom: 12, | |
| maxZoom: 14, | |
| loop: false, | |
| }); | |
| var layer = L.tileLayer('https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png',{ | |
| attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, © <a href="http://cartodb.com/attributions">CartoDB</a>' | |
| }).addTo(map); | |
| cartodb.createLayer(map, { | |
| type: "torque", | |
| order: 1, | |
| options: { | |
| query: "", | |
| loop: false, | |
| table_name: "disponibilidad", | |
| user_name: "jjsantosochoa", | |
| tile_style: $('#cartocss_template').html() | |
| } | |
| }, { | |
| https: true, | |
| tiler_protocol: 'https', | |
| tiler_port: 443 | |
| }).done(function(layer) { | |
| map.addLayer(layer); | |
| }); | |
| } | |
| // you could use $(window).load(main); | |
| window.onload = main; | |
| </script> | |
| </body> | |
| </html> | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment