Marker Using base64 encoded string

I am trying to use a custom marker on a Google Maps by using a base64 encoded string. Somehow it doesn't work.

Answers


Try doing it as follows:

var marker = new google.maps.Marker({
    position: latLng,
    map: map,
    title: 'hello',
    id: 'hehehe',
    icon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAA..."
});

Edit: Just complementing: if you're using a server side language to generate the js, you can always insert some PHP/Python/whatever code to load the image and convert it to its base64 representation.

Something like (PHP back-end):

$path = 'path/to/my/image.ext';

$info = getimagesize($info);
$ext = ($info[2]);

$data = file_get_contents($path);
$encoded = 'data:image/' . $ext . ';base64,' .base64_encode($data);

Then (front-end):

var marker = new google.maps.Marker({
    //...
    icon: '<?=$encoded;?>'
});

Need Your Help

Entity Framework Vote of No Confidence - relevant in .NET 4?

.net entity-framework .net-4.0 ado.net

I'm deciding on an ORM for a big project and was determined to go for ADO.NET Entity Framework, specifically its new version that ships with .NET 4. During my search for information on EF I stumble...

Replacing fragments and orientation change

android backwards-compatibility screen-orientation android-2.2-froyo

I'm developing an Android application targeting 2.x and 3.0 devices and thus I'm using the compatibilty API. I'm testing on Android 2.0.