Skip to content

Instantly share code, notes, and snippets.

@mvaz
Created March 11, 2015 19:24
Show Gist options
  • Save mvaz/d5c5f404faff3ea626e0 to your computer and use it in GitHub Desktop.
Save mvaz/d5c5f404faff3ea626e0 to your computer and use it in GitHub Desktop.
http://jsfiddle.net/r3ewqLvb/
http://jsfiddle.net/8Lqsjbhm/
{
"width": 500,
"height": 200,
"data": [
{
"name": "stocks",
"url": "data/stocks.csv",
"format": {"type": "csv", "parse": {"price":"number", "date":"date"}}
}
],
"scales": [
{
"name": "x",
"type": "time",
"range": "width",
"domain": {"data": "stocks", "field": "data.date"}
},
{
"name": "y",
"type": "linear",
"range": "height",
"nice": true,
"domain": {"data": "stocks", "field": "data.price"}
},
{
"name": "color", "type": "ordinal", "range": "category10"
}
],
"axes": [
{"type": "x", "scale": "x", "tickSizeEnd": 0},
{"type": "y", "scale": "y"}
],
"marks": [
{
"type": "group",
"from": {
"data": "stocks",
"transform": [{"type": "facet", "keys": ["data.symbol"]}]
},
"marks": [
{
"type": "line",
"properties": {
"enter": {
"x": {"scale": "x", "field": "data.date"},
"y": {"scale": "y", "field": "data.price"},
"stroke": {"scale": "color", "field": "data.symbol"},
"strokeWidth": {"value": 2}
}
}
},
{
"type": "text",
"from": {
"transform": [{"type": "filter", "test": "index==data.length-1"}]
},
"properties": {
"enter": {
"x": {"scale": "x", "field": "data.date", "offset": 2},
"y": {"scale": "y", "field": "data.price"},
"fill": {"scale": "color", "field": "data.symbol"},
"text": {"field": "data.symbol"},
"baseline": {"value": "middle"}
}
}
}
]
}
]
}
jQuery.fn.outerHTML = function(s) {
return s
? this.before(s).remove()
: jQuery("<p>").append(this.eq(0).clone()).html();
};
var c = d3.selectAll("g")
c.append("svg:foreignObject")
.attr("width", "100px")
.attr("height", "100px")
.html($(jqMath("p={e^{{rt}{/n}}-d}/{u-d}", "$$")).outerHTML());
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment