d3 / d3-geo

Geographic projections, spherical shapes and spherical trigonometry.

Home Page:https://d3js.org/d3-geo

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

A problem with graticule after centering the projection

Z-Richard opened this issue · comments

The graticule does not show up outside the 180° boundary.

Code to reproduce this problem:

let projection = d3.geoMercator().center([150, 25]).scale([600])

And set up the graticule as default using garticule10():

svg.append('path').datum(graticule).attr('d', path).attr('stroke', 'white').attr('stroke-width', '0.3px').attr('stroke-opacity', 0.5);

This is probably not a usual use case of d3-geo, but I want to create a map that's centered at 140-150° E with proper meridians and parallels with Mercator projection.

I apologize if there is already a solution to this, but that's definitely not listed in the official document or d3 gallery.

It appears to be working as expected
https://observablehq.com/d/52fde6c3ae99e4bc

When asking for help, please include a link to demonstrate the issue, preferably as an Observable notebook. It is often impossible to debug from code snippets alone. Isolate the issue and reduce your code as much as possible before asking for help. The less code you post, the easier it is for someone to debug, and the more likely you are to get a helpful response.

If you have a question about D3’s behavior and want to discuss it with other users, also consider the d3-js Google Group or joining the d3-js Slack.

Thank you! 🤖

I apologize for not having put it very clearly, but what I want is that the parallels extend over the 180° meridian line. The behavior now, from both our example, is that the parallels stop at the 180° meridian line. And also, no meridians are drawn east of the 180° meridian line. That's what bothers me.

The solution would be a rotate .rotate([-150, 0]) to put that meridian in the middle of the map, then .center([0, 25]) to move the parallel. (But I almost always use translate rather than center).