Help on customizing projection to display correct Map Dimensions.

[AlbertoVargasMoreno]

Hello everyone,

I am working on adapting the US choropleth example https://codepen.io/sgratzl/pen/gOaBQep for a Mexico version. The map rendering works, but I am having trouble displaying it with the correct dimensions. I assume my current problem is due to projection settings.

Current Situation

https://codepen.io/AlbertoVargasMoreno/pen/vYqjYrW

• What Works: Map rendering
• Problem: The map does not display with the correct dimensions, currently is too small

Steps Taken

1. Research: I reviewed the documentation for projection settings in ChartJS Chart Geo and also the d3.js documentation for conic projections to find a proper projection value, but none has worked as expected.

2. Findings: In researching the appropriate projection for Mexico, with https://projectionwizard.org I found the following values:

   • Albers Equal-Area Conic
   • Latitude of Origin: 23º 41' 13'' N
   • Standard Parallel 1: 17º 37' 56'' N
   • Standard Parallel 2: 29º 44' 29'' N
   • Central Meridian: 102º 39' 23'' W

3. Attempts: I tried adjusting the values for projection, projectionScale, and projectionOffset imitating this CodePen example, but without success.

Request for Help

Does anyone have ideas or suggestions on how to properly adjust the projection to display the map in the correct dimensions? There may be specific settings or additional adjustments that I might have missed.

Thank you in advance for your assistance!

[sgratzl]

you can provide a custom projection function instead of a standard one. That would allow you to build any complex one. However, I don't have enough experience how to implement your target one.

[AlbertoVargasMoreno]

Unfortunately, I don't have enough experience with Chart.js or D3.js to accomplish that. However, I appreciate you taking the time to reply and clarifying that the projection is what needs to be modified.