Skip to content

Instantly share code, notes, and snippets.

@pvernier
pvernier / .block
Last active March 11, 2018 19:19
Drop circles with d3-timer
license: gpl-3.0
@pvernier
pvernier / .block
Last active March 11, 2018 19:18
Drop circles with transition
license: gpl-3.0
@pvernier
pvernier / .block
Last active March 11, 2018 19:13
Add circle at mouse's location (2/2)
license: gpl-3.0
@pvernier
pvernier / .block
Last active March 10, 2018 18:49
Add circle at mouse's location (1/2)
license: gpl-3.0
var lines = [{
"type": "LineString",
"coordinates": [[-122.45682, 37.82033], [-122.455, 37.81762]]
}, {
"type": "LineString",
"coordinates": [[-122.455, 37.81762], [-122.45037, 37.81807]]
}, {
"type": "LineString",
"coordinates": [[-122.4625, 37.8128], [-122.46287, 37.81443]]
}, {
if ($("button.track").html() !== '') {
bounds = L.latLngBounds(positionUS._latlng, positionNZ._latlng);
map.setView(bounds.getCenter(), 15);
}
var button_tracker = L.control( { position: 'topright' } );
button_tracker.onAdd = function(map) {
var tracker = L.DomUtil.create("button", "track btn btn-default");
$(tracker).append( '<span class="glyphicon glyphicon-screenshot" aria-hidden="true"></span>');
L.DomEvent.addListener(tracker, 'click', function(e) {
var $this = $(this);
if ($this.html() == '<span class="glyphicon glyphicon-screenshot" aria-hidden="true"></span>') {
$this.html( '<span class="glyphicon glyphicon-globe" aria-hidden="true"></span>');
bounds = L.latLngBounds(positionUS._latlng, positionNZ._latlng);
var button_animation = L.control( { position: 'topright' } );
button_animation.onAdd = function(map) {
var button = L.DomUtil.create("button", "play btn btn-default");
$(button).append( '<span class="glyphicon glyphicon-play" aria-hidden="true"></span>');
return button
}
button_animation.addTo(map);
var styleBoatUS = {
radius: 30,
var point_1_us = new L.LatLng(boat_us.features[0].geometry.coordinates[1], boat_us.features[0].geometry.coordinates[0]);
var point_2_us = new L.LatLng(boat_us.features[1].geometry.coordinates[1], boat_us.features[1].geometry.coordinates[0]);
var pointList_us = [point_1_us, point_2_us];
var polyline_us = L.polyline(pointList_us, {color: '#d7301f',weight: 2.5}).addTo(map);
var point_1_nz = new L.LatLng(boat_nz.features[0].geometry.coordinates[1], boat_nz.features[0].geometry.coordinates[0]);
var point_2_nz = new L.LatLng(boat_nz.features[1].geometry.coordinates[1], boat_nz.features[1].geometry.coordinates[0]);
var pointList_nz = [point_1_nz, point_2_nz];
var point_1 = new L.LatLng(boat_us.features[0].geometry.coordinates[1], boat_us.features[0].geometry.coordinates[0]);
var point_2 = new L.LatLng(boat_us.features[1].geometry.coordinates[1], boat_us.features[1].geometry.coordinates[0]);
var pointList_us = [point_1, point_2];
var polyline_us = L.polyline(pointList_us, {color: '#d7301f',weight: 2.5}).addTo(map);
var i = 2;
function addSegment() {
if (i++ < boat_us.features.length - 1) {