Skip to content

Get ArcGeometries from TopoJSON

15. May 2013

In the previous post I described theoretically how to I apply topologic consistent linear simplification on polygonal geometries by using ArcGeometries from a TopoJSON-file.

This post will conclude the technical part…meaning: how I implemented this in JavaScript!

Although, it took me a while to understand Mike Bostocks JavaScript library topojson.js…it is really very easy!

I begin with the basic file opening:

d3.json(static/vg1000_topo.json, function(error, topology) {

Now we need the relevant layer…in my case the ‘states’

var pure_states = topology.objects.vg1000_bld;

This contains now all needed information…the arcs:


The next steps implies a differentiation for geometry types, but basically it is a loop through the array structure of all arcs. The arcs-structure equates to GeoJSON-specification of the relevant geometry type. At the end…we get each arc-id singulary and can calculate the relevant LineString-geometry for each arc, by calling:

var arcs_cache = topojson.feature(topology, {type: 'LineString', arcs:[arc_id]});

!!!!Notice, how I send it to the function…as new object with the elements ‘type’ & ‘arcs’!!!

Next…I want to store each arc only once…but sometimes they have a negative index!!! ATTENTION: The  arc-id with a negative equal is not equal to the positive one. Means arc-603 !== arc603 This is done to avoid problems with zero…see detailled information on that! So…-1 represents 0…that means for my example: arc-603===arc602.

Finally, write this ArcGeometry to an object…and this is it:


You did not understand that…although I’ve shown you so significant snippets 😉

Here is an example and the ‘complete’ code:

d3.json("static/vg1000_topo.json", function(error, topology) {
 var pure_states = topology.objects.vg1000_bld;
 //get all arc-geometries of the selected objects 'pure_states'
 var arcCollection = getArcs(topology, pure_states.geometries);


//get the arc-geometries
function getArcs(topology, geometries, simplify_){
 var col_arcs_ = {}; 
 if(d.type==='Polygon'){ readPolygon({arcs:d.arcs}); }
 else if(d.type==='MultiPolygon'){,i){return readPolygon({arcs:d.arcs[i]})}); } }) return col_arcs_;
 function readPolygon(data){
  //loop the linestrings of the polygon
  for (var i=0;i<data.arcs.length;i++){
   //get the related 'LineString's by splitting at the start/end points (length === 4) 
   for (var j=0; j<data.arcs[i].length;j++){
    var arc_id = data.arcs[i][j];
    var sign = 1; 
    if(arc_id<0){arc_id= (arc_id*(-1))-1; sign = -1;}
    var arcs_cache = topojson.feature(topology, {type: 'LineString', arcs:[arc_id]});
    arcs_cache.coordinates = arcs_cache.geometry.coordinates;
    //...simplify arc-geometries directly when specified
    if (simplify_ !== undefined){
    simplifyProcesses(arcs_cache, simplify_[0], simplify_[1])
    arcs_cache.sign = sign;
Leave a Comment

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: