This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<style> | |
#chart div { | |
background-color: brown; | |
height: 25px; | |
margin: 5px; | |
} | |
</style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<script src="../lib/d3.min.js"></script> | |
<div id="chart"></div> | |
<script> | |
var data = [5, 25, 15, 20, 10]; | |
d3.select("#chart") |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<script src="../lib/d3.min.js"></script> | |
<svg id="chart"></svg> | |
<script> | |
var data = [5, 25, 15, 20, 10]; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<script src="../lib/d3.min.js"></script> | |
<script src="../lib/vega1.5.js"></script> | |
<script src="../lib/vega-lite.js"></script> | |
<div id="chart"></div> | |
<script type="text/javascript"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<svg class="chart" width="250" height="200" fill="brown" > | |
<rect x="0" y="0" width="50" height="25"></rect> | |
<rect x="0" y="30" width="250" height="25"></rect> | |
<rect x="0" y="60" width="150" height="25"></rect> | |
<rect x="0" y="90" width="200" height="25"></rect> | |
<rect x="0" y="120" width="100" height="25"></rect> | |
</svg> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<script src="../lib/d3.min.js"></script> | |
<script src="../lib/vega.min.js"></script> | |
<div id="chart"></div> | |
<script> | |
function parse(spec) { | |
vg.parse.spec(spec, function(chart) { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<canvas id="chart" width="250" height="200"></canvas> | |
<script> | |
var data = [5, 25, 15, 20, 10]; | |
var canvas = document.getElementById("chart"); | |
var ctx = canvas.getContext("2d"); | |
ctx.fillStyle = "brown"; | |
for (i = 0; i < data.length; i++){ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html lang="en"> | |
<head> | |
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/prism/1.5.1/themes/prism.min.css'/> | |
<script src='https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.6/marked.min.js'></script> | |
<script src='https://cdnjs.cloudflare.com/ajax/libs/prism/1.5.1/prism.min.js' data-manual></script> | |
<script src='https://cdnjs.cloudflare.com/ajax/libs/prism/1.5.1/components/prism-python.min.js' data-manual></script> | |
<script src="https://rawgit.com/kokes/nbviewer.js/master/lib/nbv.js"></script> | |
<link rel='stylesheet' src="https://rawgit.com/kokes/nbviewer.js/master/lib/nbv.css"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
# Visdown | |
**Make visualisations using only markdown** | |
Write visualisation using a simple declarative markup like you would write code. Just wrap it in fenced block (three backticks) and mark the language as `vis`. | |
*Make simple static visualisations* | |
```vis | |
data: |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Use Gists to store code you would like to remember later on | |
console.log(window); // log the "window" object to the console |