Skip to content

Instantly share code, notes, and snippets.

@enjalot
Created July 6, 2014 23:54
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save enjalot/ea8cb87ef3c5574d38b1 to your computer and use it in GitHub Desktop.
Save enjalot/ea8cb87ef3c5574d38b1 to your computer and use it in GitHub Desktop.
prototype: d3.geo topojson v1
{"description":"prototype: d3.geo topojson v1","endpoint":"","display":"svg","public":true,"require":[{"name":"topojson v1","url":"http://d3js.org/topojson.v1.min.js"},{"name":"topojson v1","url":"http://d3js.org/topojson.v1.min.js"}],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"world110.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"style.css":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"fullscreen":false,"thumbnail":"http://i.imgur.com/OtZ3o1y.png","ajax-caching":true}
var svg = d3.select("svg");
var width = tributary.sw;
var height = tributary.sh;
var center = {
x: width/2,
y: height/2
}
var world = tributary.world110;
var countries = topojson.feature(world, world.objects.land);
//var lonlat = [-2, -13];
var projection = d3.geo.orthographic()
//var projection = d3.geo.albers()
//var projection = d3.geo.mercator()
.scale(200)
.rotate([9,0,0])
//.center(lonlat)
.translate([width/2, height/2])
.clipAngle(90);
// var xy = projection(lonlat);
//console.log(xy);
var path = d3.geo.path()
.projection(projection);
var graticule = d3.geo.graticule()
svg.append("path")
.datum(graticule)
.attr("class", "graticule")
.attr("d", path);
svg.append("path")
.attr("d", path(countries))
.classed("land", true);
.land {
fill: #6FC480;
stroke: #000000;
}
circle {
fill: #ffffff;
stroke: #CC0A48;
fill-opacity: 0.2
}
.graticule {
fill: none;
stroke: #777;
stroke-opacity: .5;
stroke-width: .5px;
}
Display the source blob
Display the rendered blob
Raw
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment