Skip to content

Instantly share code, notes, and snippets.

View ZJONSSON's full-sized avatar

Ziggy Jonsson ZJONSSON

85 followers · 56 following
View GitHub Profile
@ZJONSSON
ZJONSSON / index.html
Last active October 6, 2015 09:57
barStack - stacking with negative values
<!DOCTYPE html>
<html>
<head>
<script src="http://mbostock.github.com/d3/d3.v2.js"></script>
<title>barStack</title>
<style>
.axis text {
font: 10px sans-serif;
}
.axis path, .axis line {
@ZJONSSON
ZJONSSON / index.html
Created June 20, 2012 01:21
D3 + Leaflet (fork mbostock)
<!DOCTYPE html>
<title>D3 + Leaflet (fork from bost.ocks.org/mike/leaflet/)</title>
<style>
#map { width: 960px; height: 500px;}
path { fill: #000; fill-opacity: .2; stroke: #fff; stroke-width: 1.5px;}
path:hover { fill: brown;fill-opacity: .7;}
</style>
<p id="map"><p>
<script src="http://d3js.org/d3.v2.min.js?2.9.3"></script>
<script src="leaflet.js"></script>
@ZJONSSON
ZJONSSON / d3.layout.force3d.js
Created May 17, 2012 18:21
d3.layout.force3d (a quick hack to get force layout into the third dimension)
(function() {
// D3.layout.force3d.js
// (C) 2012 ziggy.jonsson.nyc@gmail.com
// BSD license (http://opensource.org/licenses/BSD-3-Clause)
d3.layout.force3d = function() {
var forceXY = d3.layout.force()
,forceZ = d3.layout.force()
,zNodes = {}
,zLinks = {}
@ZJONSSON
ZJONSSON / app.js
Last active December 13, 2015 04:09
Newton's balls
/* global d3 */
var svg=d3.select("body")
.append("svg")
.style("width","100%");
var nodes = d3.range(400).map(function(d,i) {
var radius = Math.random()*10+5 + (i<0 ? 55 : 0),
x=Math.random()*300+radius,
y=Math.random()*300+radius;
return {radius:radius,mass:radius,x:x,y:y,px:x+Math.random()*2,py:y+Math.random()*2};
@ZJONSSON
ZJONSSON / d3.z.collide.js
Last active October 25, 2023 07:04
Newton's cradle
/*
Newtonian collision checking (draft)
based on the paper: http://www.vobarian.com/collisions/2dcollisions2.pdf
ziggy.jonsson.nyc@gmail.com
*/
if (typeof d3.z != "object") d3.z = {};
(function() {
@ZJONSSON
ZJONSSON / force_labels.js
Last active May 18, 2023 08:52
Automatic floating labels using d3 force-layout
(function() {
d3.force_labels = function force_labels() {
var labels = d3.layout.force();
// Update the position of the anchor based on the center of bounding box
function updateAnchor() {
if (!labels.selection) return;
labels.selection.each(function(d) {
var bbox = this.getBBox(),
x = bbox.x + bbox.width / 2,
@ZJONSSON
ZJONSSON / index.html
Created January 11, 2012 18:32
Internalizing chart variables (mod)
<html>
<head><script type="text/javascript" src="https://raw.github.com/gist/1595803/d3mod.js"></script></head>
<body>
<script type="text/javascript">
d3.select("body")
.append("svg:svg")
.property("__chart__",function() {
return {
@ZJONSSON
ZJONSSON / d3mod.js
Created January 11, 2012 17:41
Internalizing chart variables (mod)
(function(){if (!Date.now) Date.now = function() {
return +new Date;
};
try {
document.createElement("div").style.setProperty("opacity", 0, "");
} catch (error) {
var d3_style_prototype = CSSStyleDeclaration.prototype,
d3_style_setProperty = d3_style_prototype.setProperty;
d3_style_prototype.setProperty = function(name, value, priority) {
d3_style_setProperty.call(this, name, value + "", priority);
@ZJONSSON
ZJONSSON / index.html
Created November 6, 2011 15:52
Basic filled contours in D3
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js"></script>
<script type="text/javascript" src="multiplot.js"></script>
</head>
<body></body>
<script type="text/javascript">
@ZJONSSON
ZJONSSON / index.html
Created November 2, 2011 16:10
Icesave capital structure - nest/layout example
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js?1.29.1"></script>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.layout.js?1.29.1"></script>