Ramiro Aznar ramiroaznar

## index.html
<!DOCTYPE html>
<html>
  <head>
    <title>Add legend from metadata | CARTO</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <!-- Include Leaflet -->
    <script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js"></script>
    <link href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" rel="stylesheet">
    <!-- Include CARTO.js -->

## index.html
<!DOCTYPE html>
<html>
  <head>
    <title>Dropdown + setQuery | CARTO.js</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <!-- Include jQuery -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <!-- Include Leaflet -->
    <script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js"></script>

## index.html
  <!DOCTYPE html>
<html>
  <head>
    <title>Layer with aggregation | CARTO.js</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <!-- underscore -->
    <script src="https://fastcdn.org/Underscore.js/1.8.3/underscore-min.js"></script>
    <!-- jquery -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

## index.html
 <!DOCTYPE html>
<html>
  <head>
    <title>Buildings 2.5D | CARTO.js v4</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <link href="https://fonts.googleapis.com/css?family=Montserrat:400,600,700|Open+Sans:300,400,600" rel="stylesheet">
    <!-- Include Leaflet -->
    <script src="https://unpkg.com/leaflet@1.2.0/dist/leaflet.js"></script>
    <link href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" rel="stylesheet">

## index.html
  <!DOCTYPE html>
<html>
  <head>
    <title>Feature click + 2 layers | CARTO.js v4</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <link href="https://fonts.googleapis.com/css?family=Montserrat:400,600,700|Open+Sans:300,400,600" rel="stylesheet">
    <!-- Include Leaflet -->
    <script src="https://unpkg.com/leaflet@1.2.0/dist/leaflet.js"></script>
    <link href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" rel="stylesheet">

## style.css
    Map {
      -torque-frame-count: 256;
      -torque-animation-duration: 80;
      -torque-time-attribute: "date";
      -torque-aggregation-function: "avg(avail_ratio*100)";
      -torque-resolution: 4;
      -torque-data-aggregation: linear;
    }
    #layer {
      marker-width: 7;

## index.html
<!DOCTYPE html>
<html>
<head>
  <title>Layer as basemap with CARTO.js v4</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" />

    <!-- leaflet -->
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" />

## index.html
<!DOCTYPE html>
<html>
<head>
  <title>SQL Slider with CARTO.js v4</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" />

    <!-- leaflet -->
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" />

## index.html
<!DOCTYPE html>
<html>
<head>
	<title>Layer and metadata objects in CARTO.js v4</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" />

    <!-- leaflet + jquery -->
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" />

## README.md

      
        
          
            
              
              2 files
            
          
          
            
              
              0 forks
            
          
          
            
              
              0 comments
            
          
          
            
              
              0 stars
            
          
        
        
          
              
          
          
            
                ramiroaznar
                / README.md
            
            
              Last active
              January 4, 2018 08:41
            
              
                Histogram widget as legend with CARTO.js v4
              
          
        
      
        
  
      
    Hitogram colors added thanks to @IagoLast.
UPDATE: this is not working as expected, I recommend using this other approach.
	<!DOCTYPE html>
	<html>
	<head>
	<title>Add legend from metadata \| CARTO</title>
	<meta name="viewport" content="initial-scale=1.0">
	<meta charset="utf-8">
	<!-- Include Leaflet -->
	<script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js"></script>
	<link href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" rel="stylesheet">
	<!-- Include CARTO.js -->
	Map {
	-torque-frame-count: 256;
	-torque-animation-duration: 80;
	-torque-time-attribute: "date";
	-torque-aggregation-function: "avg(avail_ratio*100)";
	-torque-resolution: 4;
	-torque-data-aggregation: linear;
	}
	#layer {
	marker-width: 7;