How do I get a pin on Google Maps using location from a variable?

Question

I want to place the pins on my Google Maps map with a variable containing the location, when I make one like this, my pin works.

var imageDriver = 'marker.png';
var DriverLatLng = new google.maps.LatLng(62.446026, 17.331340);
var driverMarker = new google.maps.Marker({
    position: DriverLatLng,
    map: map,
    icon: imageDriver,

But I want to use this method, to store the latitude and longitude inside a variable:

var location = "62.446026, 17.331340";
var imageDriver = 'marker.png';
var DriverLatLng = new google.maps.LatLng(location);
var driverMarker = new google.maps.Marker({
    position: DriverLatLng,
    map: map,
    icon: imageDriver,

When I do as the second snippet, the pin just disappear. What is causing this?

Thanks

Answer 1

The google.maps.LatLng() function doesn't take string parameters. It takes the following parameters:

lat    : number
lng    : number 
noWrap : boolean // Optional

This is documented here: https://developers.google.com/maps/documentation/javascript/reference#LatLng

You could store the latitude and longitude this way:

var location = { 
    lat: 62.446026, 
    lng: 17.331340 
};

var imageDriver = 'marker.png';
var DriverLatLng = new google.maps.LatLng(location.lat, location.lng);
var driverMarker = new google.maps.Marker({
    position: DriverLatLng,
    map: map,
    icon: imageDriver,

Answer 2

google.maps.LatLng() requires 2 numeric values, you're trying to initialize it with a string.

You could split the string into an array and then parse both strings inside the array as float for long and lat value:

location = location.split(',');
var DriverLatLng = new google.maps.LatLng(parseFloat(location[0]),parseFloat(location[1]));
....

Answer 3

The problem is that you're supplying your LatLng constructor in the second instance with a string. This isn't correct and won't work - this is why you're not seeing the pin. In the first instance, you're giving it two numbers which is good.

You can see the documentation here: https://developers.google.com/maps/documentation/javascript/reference#LatLng

To do what you're trying to do, you could have two variables (which are numbers):

var locationLat = 62.446026;
var locationLng = 17.331340;
var DriverLatLng = new google.maps.LatLng(locationLat,locationLng);

...or you could do something like they've done in this answer: Convert String to latlng google maps, if you're determined to keep your latitude and longitude in a string.
...or you could create a new object and assign the latlng to it if you wanted a single variable:

var myLatLng = new Object();
myLatLng.lat = 62.446026;
myLatLng.lng = 17.331340;

...or, having constructed the google LatLng object, you could get the lat and lng out of it later like so:

var myLatLng = new google.maps.LatLng(62.446026, 17.331340);
// some other stuff here
var myStringLatLng = myLatLng.lat() + ',' + myLatLng.lng();

I guess the best option depends on what you're trying to do!