Skip to content

Instantly share code, notes, and snippets.

View timelyportfolio's full-sized avatar

timelyportfolio timelyportfolio

1.1k followers · 1.2k following
View GitHub Profile
@abeppu
abeppu / index.html
Last active April 24, 2023 13:19
candlestick charts using d3
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js?1.25.0"></script>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.time.js?1.25.0"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
</head>
<body>
<div id="chart"></div>
@mbostock
mbostock / .block
Last active March 29, 2023 23:39
Collapsible Indented Tree
license: gpl-3.0
redirect: https://observablehq.com/@d3/indented-tree
@charliepark
charliepark / hatchshow.js
Created July 30, 2011 16:07
A jquery typography plugin.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" charset="utf-8">
$(window).load(function(){
$().hatchShow();
});
jQuery.fn.hatchShow = function(){
$('.hsjs').css('display','inner-block').css('white-space','pre').each(function(){
var t = $(this);
t.wrap("<span class='hatchshow_temp' style='display:block'>");
var pw = t.parent().width();
@mbostock
mbostock / .block
Last active September 17, 2021 06:42
Stacked Bar Chart
license: gpl-3.0
@benjchristensen
benjchristensen / index.html
Created August 16, 2011 03:21
Animated Line Graphs / Sparklines using SVG Path and d3.js
<html>
<head>
<title>Animated Sparkline using SVG Path and d3.js</title>
<script src="http://mbostock.github.com/d3/d3.v2.js"></script>
<style>
/* tell the SVG path to be a thin blue line without any area fill */
path {
stroke: steelblue;
stroke-width: 1;
fill: none;
@mbostock
mbostock / .block
Last active December 21, 2023 19:06
Small Multiples
license: gpl-3.0
@mbostock
mbostock / .block
Last active April 5, 2022 10:10
Axis Component
license: gpl-3.0
@stepheneb
stepheneb / index.html
Last active June 17, 2023 04:10
D3 Example: zoom, pan, and axis rescale
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>One Graph</title>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.v2.js"></script>
<script type="text/javascript" src="simple-graph.js"></script>
<style type="text/css">
body { font: 13px sans-serif; }
rect { fill: #fff; }
@wavded
wavded / fipsToState.json
Created September 29, 2011 15:27
State FIPS JSON
{
"01": "Alabama",
"02": "Alaska",
"04": "Arizona",
"05": "Arkansas",
"06": "California",
"08": "Colorado",
"09": "Connecticut",
"10": "Delaware",
"11": "District of Columbia",
@tomhaymore
tomhaymore / index.html
Created September 30, 2011 22:28
Zoomable Icicle with Text in D3.js
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js"></script>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.layout.js"></script>
<style>