JVectorMap coordinates for bbox

Question

I created a custom SVG country map and built it using jVectorMap. Now I'm trying to insert markers using lat / long on this card, but I don’t understand how the "bbox" x system works; y.

I suppose I need to reverse project the max and min lat / long of my map, but even if I look at the Alaska example below, I don’t understand how x was obtained; y. I tried using inv_aea from proj.js without recognizing anything significant.

projection: { centralMeridian: -100, type: "aea" } insets: [{ "left": 0 "top": 440, "width": 220, "height": 147 "bbox":[{ "y": -8441281.712315228, "x": -5263934.893342895 },{ "y": -6227992.545028123, "x": -1949631.2950683108 } }] 

Answer 1

The width and height of the attachments should be equal to the width and height of the map.

Answer 2

I honestly don’t understand what you are trying to do, but if you want to insert markers using the image as a map, you should take into account that your original coordinates (latitude / logic pair) are expressed using the WGS84 (EPSG: 4326) standard (dot on ellipsoid), while you want to present them on a flat surface. What you need to do is use the global spherical projection of the Mercators (see http://spatialreference.org/ref/epsg/3785/ ) to represent your coordinates in meters (EPSG: 3785). After you have done this conversion (I suggest you use this library or a similar one: proj4js ), you can do simple calculations and proportions to represent your points on a simple map.

I created a working jsfiddle using an example that I did more than two years ago before starting university, I was a newbie in programming, so please forgive the incorrect formatting of the code.

Live demo

 you can check the live demo by clicking the link above