How to locate a latitude and longitude with jVector Map Plugin

Question

I know that google maps has markers to highlight certain points in the map. I am for some reason not comfortable putting this type of map on my site and love the jvector map effects. But I am not able to figure out how to define markers in the jVectorMap, does anybody have a clue as to how to define the markers in jVectorMap and highlight those points. I would also love to know how would you get to the certain point in jVector Map using latitude and longitude.

Thanks.

Amoebocyte

Could you edit the title, the question isn't related to google maps vs jvectormap. This will mislead people searching for a comparison. – Sachs

Answer 1

Now you can do that, new version of jVectorMap (0.2) introduces such feature with markers parameter. Check out demo here http://jvectormap.com/examples/markers-world/.

Meteorograph

Thanks, Are you generating markers as svg, can't we add our own markers as customizable images. – Amoebocyte

Unfortunately not in the current version. – Meteorograph

Answer 2

The jVectorMap world map uses the van der Grinten projection. The formula to convert from/to the map can be found this Wikipedia and Wolfram article.

You'll need to scale it to your map's size & offset, given the above formula projects the long/lat (-180 to 180 deg) to a (-1 to +1) cartesian grid.

Also, the angles in the formula should be in radians, not in degrees.

function vanDerGrinten(lat, lng) {
    lat = lat * Math.PI / 180;
    lng = lng * Math.PI / 180;
    var lng0 = 0;
    var A1 = 0.5 * Math.abs((Math.PI / (lng - lng0) - (lng - lng0) / Math.PI));
    var phi = Math.asin(Math.abs(2 * lat / Math.PI));
    var G = Math.cos(phi) / (Math.sin(phi) + Math.cos(phi) - 1);
    P = G * (2 / Math.sin(phi) - 1);
    Q = A1 * A1 + G;
    x0 = A1 * A1 * (G - P * P) * (G - P * P) - (P * P + A1 * A1) * (G * G - P * P);
    x1 = (A1 * (G - P * P) + Math.sqrt(x0));
    x2 = (P * P + A1 * A1);
    x = sgn(lng - lng0) * Math.PI * x1 / x2;
    y = sgn(lat) * Math.PI * Math.abs(P * Q - A1 * Math.sqrt((A1 * A1 + 1) * (P * P + A1 * A1) - Q * Q)) / (P * P + A1 * A1);
    return { _x: x, _y: y };
}

Greenes

Answer 3

A jvector map is just that, a vector map. You would need to create some type of correspondence between lat/lng and your vector space (eg: 1px = 1deg). This will either require customizing the map, or making some precise measurements of it to establish the scale. Not to mention that you'll need to be sure you're using a mercator projection so that parallel lines even mean what you think they mean ;)

EDIT: If you have a problem with google maps I would recommend using an alternative like leaflet, not trying to extend jVector map to do two things (plot points, and draw to scale) that it wasn't meant to do.

Conoid