Skip to content

Instantly share code, notes, and snippets.

@derekacosta
Forked from shiffman/earthquake.js
Created February 10, 2017 18:45
Show Gist options
  • Select an option

  • Save derekacosta/fa0521ba1409f823f0c80c24d37d71b5 to your computer and use it in GitHub Desktop.

Select an option

Save derekacosta/fa0521ba1409f823f0c80c24d37d71b5 to your computer and use it in GitHub Desktop.

Revisions

  1. @shiffman shiffman created this gist Feb 10, 2017.
    83 changes: 83 additions & 0 deletions earthquake.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,83 @@
    // https://api.mapbox.com/styles/v1/mapbox/streets-v8/static/0,0,2/600x600?access_token=pk.eyJ1IjoiY29kaW5ndHJhaW4iLCJhIjoiY2l6MDJ0Mjk5MDQ1dzJ3bzRiM29zaW16ayJ9.guiqnHMGUq196Zxa1d3UPg

    var mapimg;
    var zoom = 1;
    var data;
    var ww = 900;
    var hh = 900;
    var clat = 0; //37.7749;
    var clon = 0; //-122.4194;


    function preload() {
    mapimg = loadImage('https://api.mapbox.com/styles/v1/mapbox/dark-v9/static/' + clon + ',' + clat + ',' + zoom + '/' + ww + 'x' + hh + '?access_token=pk.eyJ1IjoiY29kaW5ndHJhaW4iLCJhIjoiY2l6MDJ0Mjk5MDQ1dzJ3bzRiM29zaW16ayJ9.guiqnHMGUq196Zxa1d3UPg');
    data = loadStrings('http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.csv');
    }

    // Web Mercator Math
    // https://en.wikipedia.org/wiki/Web_Mercator
    function mercX(lon) {
    lon = radians(lon);
    return (256 / PI) * pow(2, zoom) * (lon + PI);
    }

    function mercY(lat) {
    lat = radians(lat);
    return (256 / PI) * pow(2, zoom) * (PI - log(tan((PI / 4.0) + (lat / 2.0))));
    }

    function webMercX(lon, zoom) {
    lon = radians(lon);
    var w = 256; //width / 2;
    var a = (w / PI) * pow(2, zoom);
    var b = (lon + PI);
    return a * b;
    }

    function webMercY(lat, zoom) {
    lat = radians(lat);
    var w = 256; //height / 2;
    var a = (w / PI) * pow(2, zoom);
    var c = tan(PI / 4 + lat / 2);
    var b = PI - log(c)
    return a * b;
    }


    function setup() {
    createCanvas(ww, hh);
    angleMode(RADIANS);
    translate(width / 2, height / 2);
    imageMode(CENTER);
    image(mapimg, 0, 0);

    var cx = webMercX(clon, zoom);
    var cy = webMercY(clat, zoom);

    //37.7749° N, 122.4194° W


    var lat = 40.7128;
    var lon = -74.0059;
    var x = webMercX(lon, zoom) - cx;
    var y = webMercY(lat, zoom) - cy;
    noStroke();
    fill(255, 0, 0, 200);
    ellipse(x, y, 32, 32);

    fill(255, 0, 0, 200);
    ellipse(cx - cx, cy - cy, 32, 32);


    for (var i = 1; i < data.length; i++) {
    var stuff = data[i].split(/,/);
    console.log(stuff[1], stuff[2]);
    var lat = Number(stuff[1]);
    var lon = Number(stuff[2]);
    var x = webMercX(lon, zoom) - cx;
    var y = webMercY(lat, zoom) - cy;
    noStroke();
    fill(255, 0, 0, 200);
    ellipse(x, y, 4, 4);
    }
    }