Skip to content

Instantly share code, notes, and snippets.

@osoken
osoken / index.html
Last active February 6, 2016 10:06
leaflet.js and d3.js example
<!DOCTYPE html>
<meta charset='utf-8'>
<script src='//d3js.org/d3.v3.min.js'></script>
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.css' />
<script src='https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.js'></script>
<body>
<div style='width:960px;height:500px'></div>
<script>
var map = new L.Map(d3.select('div').node()).setView([35.678707, 139.739143], 12);
var tile = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
@osoken
osoken / index.html
Last active February 6, 2016 10:07
japan.topojson with labels
<!DOCTYPE html>
<meta charset='utf-8'>
<script src='https://d3js.org/d3.v3.min.js'></script>
<script src='https://d3js.org/topojson.v1.min.js'></script>
<body>
<div id='map_canvas' style='position:absolute'></div>
<script>
var map={};
@osoken
osoken / index.html
Last active February 6, 2016 10:08
japan.topojson (canvas)
<!DOCTYPE html>
<meta charset='utf-8'>
<script src='//d3js.org/d3.v3.min.js'></script>
<script src='https://d3js.org/topojson.v1.min.js'></script>
<body>
<div id='map_canvas' style='position:absolute'></div>
<script>
var map={};
@osoken
osoken / index.html
Last active February 6, 2016 10:10
Yamanote direction signs
<!DOCTYPE html>
<meta charset="utf-8">
<script src="//d3js.org/d3.v3.min.js"></script>
<body>
<script>
var width = 960;
var height = 500;
var radius = 170;
var data={};
@osoken
osoken / README.md
Last active February 6, 2016 10:10
Simple clock

日本標準時のアナログ時計。

@osoken
osoken / index.html
Last active February 6, 2016 10:11
japan.topojson
<!DOCTYPE html>
<meta charset="utf-8">
<script src="//d3js.org/d3.v3.min.js"></script>
<script src="//d3js.org/topojson.v1.min.js"></script>
<body>
<div id='map_canvas' style='position:absolute'></div>
<script>
var map={};
@osoken
osoken / index.html
Last active February 6, 2016 10:12
Input driven bar chart
<!DOCTYPE html>
<meta charset="utf-8">
<script src="//d3js.org/d3.v3.min.js"></script>
<body>
<div id='control' style='height:20px;border:0;padding:0;margin:0'>
<input type='text' style='width:640;height:18px;margin:0;padding:0;border:solid 1px'></input>
</div>
<div id='graph' style='height:480px;border:0;padding:0;margin:0'>
</div>
<script>
@osoken
osoken / globe.png
Last active February 7, 2016 07:57
Drag and Drop GeoJson
globe.png
@osoken
osoken / d3.radialline.js
Last active March 19, 2016 16:30
Radial line chart
!(function(d3)
{
var constant = function(d)
{
return function constant()
{
return d;
}
}
@osoken
osoken / downloadbtn.png
Last active March 20, 2016 07:15
Download as PNG
downloadbtn.png