Skip to content

Instantly share code, notes, and snippets.

View Andrew-Reid's full-sized avatar

Andrew-Reid

8 followers · 0 following
View GitHub Profile
@Andrew-Reid
Andrew-Reid / index.html
Last active February 22, 2020 14:56
Leaflet and Popup with D3
<!DOCTYPE html>
<html>
<head>
<title>Leaflet with D3 popups</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.13.0/d3.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ==" crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js" integrity="sha512-/Nsx9X4HebavoBvEBuyp3I7od5tA0UzAxs+j83KgC8PU0kgB4XiK4Lfe4y4cgBtaRJQEIFCW+oC506aPT2L1zw==" crossorigin=""></script>
@Andrew-Reid
Andrew-Reid / index.html
Last active October 9, 2022 11:10
Nested Enter/Update/Exit with id
<html>
<head>
<script src="https://d3js.org/d3.v4.js"></script>
</head>
<body>
<script>
// starter data:
var data = [
{id:0, children: d3.range(10)},
@Andrew-Reid
Andrew-Reid / index.html
Last active April 18, 2018 04:14
D3.force, multiple sets of multiple foci
<!DOCTYPE html>
<meta charset="utf-8">
<style>
.links line {
stroke: #999;
stroke-opacity: 0.6;
}
.nodes circle {
@Andrew-Reid
Andrew-Reid / index.html
Last active June 29, 2018 11:41
Voronoi - voronoi.findAll()
<html>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="voronoi.js"></script>
<body>
<script>
var width = 960;
var height = 500;
var data = d3.range(200).map(function(d) {
var y = d3.randomNormal(height / 2,80)();
@Andrew-Reid
Andrew-Reid / index.html
Last active April 13, 2018 05:27
Lichen.js Basic Example
<!DOCTYPE html>
<meta charset="utf-8">
<svg width="960" height="500"></svg>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="lichen.js"></script>
<script>
var svg = d3.select("svg"),
width = +svg.attr("width"),
height = +svg.attr("height");
@Andrew-Reid
Andrew-Reid / index.html
Last active May 14, 2018 05:49
Lichen.js Choropleth + Texture / Bivariate Choropleth.
<!DOCTYPE html>
<meta charset="utf-8">
<svg width="960" height="500"></svg>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="lichen.js"></script>
<script>
var svg = d3.select("svg"),
width = +svg.attr("width"),
height = +svg.attr("height");
@Andrew-Reid
Andrew-Reid / Americas.json
Last active May 13, 2018 22:12
Lichen.js Official Languages in the Americas
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@Andrew-Reid
Andrew-Reid / chevronArc.js
Last active September 16, 2018 05:29
Lichen.js Pattern Showcase
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('d3-path')) :
typeof define === 'function' && define.amd ? define(['exports', 'd3-path'], factory) :
(factory((global.d3 = global.d3 || {}),global.d3));
}(this, (function (exports,d3Path) { 'use strict';
var constant$1 = function(x) {
return function constant() {
return x;
};
@Andrew-Reid
Andrew-Reid / index.html
Last active January 22, 2018 23:31
Force Transitions to End State and Trigger End Event
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.11.0/d3.js"></script>
<body>
<script>
d3.selection.prototype.finish = function() {
// check if there is a transition to finish:
if (this.node().__transition) {
// if there is transition data in any slot in the transition array, call the timer callback:
var slots = this.node().__transition;
var keys = Object.keys(slots);
@Andrew-Reid
Andrew-Reid / Americas.json
Last active January 12, 2018 02:32
National Official Languages in the Americas 2
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.