D3.js is a small, open-source JavaScript visualization library for manipulating HTML and SVG documents based on data

learn more… | top users | synonyms

1
vote
0answers
19 views

Javascript - barChart not filtered on click of geoChoroplethChart

I have a choropleth map of counties, and a bar chart showing population of each county on the map. When I click on the bar chart the map is filtered and redrawn to show the selected bar, but when I ...
0
votes
0answers
24 views

TopoJSON rendering issues using D3

I have rendered the world map using world-110m topojson. I directly used the code provided by Jakob on D3 mapping tutorial - http://www.digital-geography.com/d3-js-mapping-tutorial-1-set-initial-...
0
votes
0answers
20 views

SVG layer using d3 on ol3 map creates problem

when I created a svg layer using d3 on ol3 map, I saw that the svg layer intersected with zoom-in control. Then as I click for zoomin-in, it doesn't function. What do you advice? regards
0
votes
0answers
38 views

Using ordnance survey data to make a D3 map?

I would like to display a map of the UK Westminster Parliamentary Constituencies in D3 with a width of 980px. I have downloaded and extracted the ordnance survey ESRI shapefiles from here: https://...
0
votes
0answers
17 views

Zone map by interpolation of point data using d3js

Is it possible to generate a DEM (elevation model) or any zone map by interpolation of point data using d3js? Where can I find an example?
1
vote
2answers
59 views

D3 can't render GeoJson file (Simple structure in Montreal, Canada) created in QGIS

I am attempting to render SVG and attach it to a div with id="map". I can do this successfully with GeoJson which I acquired from this tutorial: http://maptimeboston.github.io/d3-maptime/#/1 Excerpt: ...
1
vote
0answers
18 views

Can we combine SVG Overlay with MarkerCluster v3?

I have searched here and there on how to prevent the overlapping circle (svg) layer created from json file. Poor me, no luck till now. Since I doesn't know how to prevent the overlapping circle I ...
0
votes
0answers
35 views

Not able to draw line in Kendo Map using d3.js

I am using Kendo Map and d3.js in my project,I am able to show the markers and able to draw the lines between them,I am having a requirement like I should be able to draw a line anywhere in the map....
5
votes
1answer
60 views

Attempting to map GeoJson file producing issues

I've been trying to get this to work for some time now. The end goal is to produce a map I can show using d3.js, however d3 is butchering the map and producing an undesirable image. The code is as ...
4
votes
1answer
260 views

D3: center a map feature using correct latitude and longitude, without rotation?

The following is a map of Chicago which I've created in D3.js, and the JS code to render it. I had a very hard time centering Chicago within my viewfinder (the white box). After much trial and error,...
2
votes
0answers
49 views

How to remove projection in terminal from .shp file with valid .prj available

I have .prj, .shp, .sbn, .sbx, .shx, .dbf files where the content of the .prj file is the following: PROJCS["S-JTSK_Krovak_East_North",GEOGCS["GCS_S_JTSK",DATUM["D_S_JTSK",SPHEROID["Bessel_1841",...
0
votes
0answers
36 views

A problem with d3 linearGradient in Firefox

I run into a problem with d3 linearGradient in firefox. It is not displayed. But, same code runs well in chrome. here is the relevant code: svg.append("linearGradient") ....
1
vote
0answers
130 views

Draw d3 svg circles on openlayers 3 maps

I am new to openlayers and d3. I tried following example [http://openlayers.org/en/master/examples/d3.html] I see we need to add d3 features on a canvas and project it on an openlayers Vector layer. ...
1
vote
0answers
21 views

D3 problem on placing a circle on area

I am using d3. I normally constructed d3.svg.area().interpolate("basis") then I want to put a circle on outline of the area. But, because of interpolate("basis"). The outline is not at exact place. ...
1
vote
0answers
88 views

Plot a bubble chart in d3.js by giving an local geojson file as an input

This is the content in my geojson file { "type": "FeatureCollection", "features": [{ "type": "Feature", "properties": { "profit": 326, "npa": 174.000000 } }, { "type": ...
1
vote
1answer
228 views

D3 - Loading data from JSON doesn't work

I'm starting to learn D3 and it seems like a powerful framework. I'm trying load the data from json. I can see data but nothing happen after loading data into D3 library. There are no error messages ...
1
vote
0answers
36 views

getting started designing satellite projection raster

How do I get started designing a map with a satellite projection like this:http://bl.ocks.org/joyrexus/6619251. So far using d3 I've created a map of North Africa w/ topojson and tiles from Mapbox but ...
1
vote
0answers
74 views

d3.js Projection for Washington DC area

I'm making a small thematic map of the Washington DC area using d3.js. Everything I've tried "tilts" the square of DC. Is there a d3 projection that will put DC at the right angle? https://github....
0
votes
1answer
26 views

Finding contiguous geographical units

On a map with territorial units, I wish to be able to compare a property of one territorial unit with those surrounding it. How can I find the contiguous territorial units of a specific one ?
2
votes
1answer
33 views

Map with style (color, border) depending on property value

Using Leaflet combined with D3, I'm trying to apply a style (e.g. colorize or draw a border) to units that share a same property value. Further explanations Context: townships in France are grouped ...
1
vote
0answers
207 views

OpenLayer 2 and D3.js:Set the rigtht size of the SVG overlay

I am following an example of D3.js used in conjunction with OpenLayers 2 to display GeoJSON on a map. http://bl.ocks.org/mbertrand/raw/5218300/quakes.html In this example, the author set the bounds ...
0
votes
0answers
138 views

Presenting specified country only based on latitude and longitude data passing by d3 user?

I am using d3/topojson and I'd like to color (or present) only two countries where two users are located.(The location of a user is represented by latitude and longitude.) I am modifying code from ...
3
votes
1answer
338 views

D3 javascript and GeoJSON: lines in Stockholm map very strange

All the code and shapefiles that I'm using are available in this GitHub repo. I'm trying to draw a map of Stockholm with D3. The shapefile looks ok in QGIS: However, drawing the GeoJSON produces ...
7
votes
4answers
2k views

Methods to Convert .SVG File to GeoJSON

Question How do I convert an SVG file to GeoJSON format? Desired Outcome: I want to make a choropleth map using something like D3.js, or any of the other libraries out there. Challenge: I have an ...
1
vote
0answers
90 views

Matching d3.js geo projection with pyproj Proj4

I am having trouble figuring out the correct notation for Proj4 projections with pyproj. I got the following projection in d3.js and I want to match it with pyproj on my backend to send a background ...
1
vote
1answer
208 views

ogr2ogr problem mapping shapefile to geojson ETRS89 / Poland CS92

I'm trying to convert official boundaries of administrative regions of Poland from official governmental site (codgik.gov.pl). I want to use those data because they are official ones, and set contains ...
1
vote
1answer
136 views

Good projections for Middle East and North Africa in D3?

I'm a data visualizer who's mostly worked with US data, and I'm familiar with AlbersUSA project. However, I'm going to be doing a series of graphics on the Middle East. Any suggestions or interesting ...
1
vote
1answer
1k views

Multiple GeoJSON Layers

I have a leaflet map of the US and I would like to toggle between zip codes and county shapes. There seems to be no tutorials on how to achieve this in the documentation or an other forums I have ...
1
vote
0answers
114 views

Rectangular bounding box curved in D3.js

I am trying to project polygons to a map with a static background image using D3.js. The polygons looked slightly off in relation to the background so I drew the bounding box of the image, and sure ...
1
vote
1answer
754 views

GeoJson and D3.js multipolygon

I have this geometric shape file, so no map of a city. I store the two Shapefiles in a GIS database as a geometric form. Now, I want to visualize the geojson data. I created the GeoJson data ...
3
votes
0answers
352 views

Align vector and raster layers with D3

I have a geocoded raster image that I want to use as the background to a vector map with D3.js. The screenshot shows the layers in QGIS (grey is raster). Here's the markup for the map: <div class="...
0
votes
0answers
66 views

CartoDB example for Airport routes?

I am a developer and I wanted to make a website where I can draw route from on Airport location to another airport location. But the route should be using D3.js or carto db. I am new in this ...
3
votes
0answers
82 views

Finding centroids for icosahedral gnomonic projection?

I've been trying to create an icosahedral gnomonic projection, like this example by Jason Davies or this one (the Fisher projection). The method that I initially used was using the centroid of each ...
0
votes
2answers
191 views

Responsive d3 choropleth showing commuter flows between counties?

I would like to create a responsive choropleth using d3. When one clicks on a county, the choropleth updates to reflect commuter flows between that county and all others. Example input data looks like ...
5
votes
0answers
320 views

Any Examples of D3.brush() used with Leaflet?

I have a leaflet map that I have placed an SVG "on top of" using the leaflet overlay pane. I want to add a D3 brush to the overlay pane that will then update a separate chart. I've looked around for ...
2
votes
0answers
116 views

JSON Layer does not show when .setview Changes

I've set a Mapbox map with a geoJSON layer overlaying it. The problem is that with the default set values, the json layer shows up just fine. However, If I change the .setView too much, the json layer ...
2
votes
1answer
376 views

How to nest GeoJSON features based on their geometry in javascript?

I have a GeoJson object with polygon features. Some of them have same geometry. They look like this: squareData = { "type": "FeatureCollection", "crs": { "type": "name", "properties": { "name": "urn:...
0
votes
1answer
200 views

GRIB data interpolation

I've been wrangling around in GFS grid based data (GRIB - mostly 0.5 degree resolution). I'm interested in plotting these by converting to geojson with ogr2ogr (which is quite easy). However, is there ...
1
vote
1answer
197 views

Add multiple strokes to Leaflet geojson feature path

Wondering if it's possible to add multiple strokes to a polygon or line feature (the same thing could apply to multiple fills for polygons too). The leaflet documentation on the L.Path style options ...
1
vote
1answer
651 views

Firefox and D3: Zoom + Pan bug

I have a simple code here some map with zoom+pan effect. It work fine on Opera, Chrome even IE. But Firefox do not show it.- If you open "Inspector" panel, you'll see has same values (translation, ...
3
votes
0answers
29 views

Creating a distance overlay that is computed by the distance of points/lines and recalculated on zooming

I created a fictional map and visualized it with d3. Now I would like to show a scale/rule so that the user can see which distance (kilometers,meters) he is currently using. I was thinking about ...
3
votes
1answer
372 views

D3 missing zoom Choropleth + Raster

Following this example and Choropleth from Mike's site I am trying to get: image + vector + choropleth = my map As you can see I lost the zoom capability on the vector layer. I have been trying ...
2
votes
1answer
239 views

Showing link for every city at different zoom levels using Leaflet?

I have a Leaflet map that I am using to render a map of the U.S. The map will have specific zoom levels. For example, when the map first loads it will show major U.S. cities. Then if you zoom in it ...
4
votes
1answer
392 views

d3 + Leaflet apply class value from geojson data

I have a geojson file that I'l able to draw just fine with D3 + Leaflet. I'm having trouble applying a class to the svg objects with a value from the geojson file. Each feature in the geojson file has ...
0
votes
2answers
407 views

Converting area of a polygon from steradians to square kilometers using D3.js?

How can I find the area of a polygon in square km using D3.js? I'm not even really sure whether to use d3.geo.path.area or d3.geo.area. Here is my code (JSFiddle): var d = { "type":"Feature", ...
2
votes
1answer
3k views

D3.js cannot render my geoJSON file

I've been trying to draw maps using the d3.js library in a manner similar to that below. <script> //Width and height var w = 500; var h = 300; //Define path ...
1
vote
1answer
286 views

Draw line overlays and center map

(Apologies if this is a trivial question; I'm completely new to the GIS world.) I have a dataset with start and end points of lines. Columns in the table are unique_line_id, line_start_point_lat, ...
3
votes
1answer
155 views

Troubleshooting with Tiger for d3 — is this the wrong projection? Why's it look like this?

UPDATE: Solved, sort of … I downloaded the file afresh and tried feeding it through ogr2ogr and topojson again … and wouldn't you know … after a while it worked. I think I was possibly not setting an ...
8
votes
1answer
598 views

demers cartogram

How do you make a demers cartogram from a shapefile/topojson/geojson? I have tried scapetoad and indiemapper and i can not duplicate what you find on the links below. http://graphics.latimes.com/2012-...
0
votes
0answers
77 views

Topojson Rendering Problem

This block has a topojson file that's being rendered such that each polygon fills the world: http://bl.ocks.org/emeeks/6bc43691f631a4097d05 It includes the geojson file that it was derived from, ...