--- title: "Google maps: egna markers" type: "forum-thread" url: "https://www.webforum.nu/amne/javascript/192309-google-maps-egna-markers" topic: "JavaScript" topic_url: "https://www.webforum.nu/amne/javascript" author: "Kolsyra" published: "2014-05-16T14:59:44.000Z" updated: "2014-05-16T18:12:35.000Z" replies: 4 views: 891 page: 1 pages: 1 language: "sv-SE" site: "webForum — webforum.nu" rights: "Upphovsrätten till varje inlägg tillhör dess författare." attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/192309-google-maps-egna-markers" --- # Google maps: egna markers ## #1 — Kolsyra, 2014-05-16T14:59Z Hej, nu har jag återigen fastnat i google maps. Försöker lägga till egna markörer för olika platser på kartan (just nu har jag bara en png-fil för att se att dom visas öht, som det är nu kommer det inte upp någon markör alls.), hittade ett inlägg om detta på och har försökt göra som det står där men lyckas inte. Tänkte höra här om någon gjort något liknande och kan se vad det är jag gör för fel. HTML & Javascript ```

``` CSS ``` html, body { width: 100%; height: 100%; margin: 0px; padding: 0px; } #map_canvas { width: 100%; height: 100%; } ``` Tack på förhand /Kolsyra Permalänk: https://www.webforum.nu/p/192309 ## #2 — metalboy, 2014-05-16T16:34Z Du försöker använda variabeln *map* innan du har skapat den. Permalänk: https://www.webforum.nu/p/2316196 ## #3 — Kolsyra, 2014-05-16T17:49Z @metalboy Tack för svaret men nu hänger jag inte riktigt med på vart/hur jag ska skapa den för att det ska fungera, är relativt grön på detta med javascript. Skulle du kunna ge mig en hjälpande hand med att förklara detta? Vill gärna förstå hur allt hänger ihop. /Kolsyra Permalänk: https://www.webforum.nu/p/2316197 ## #4 — voigtann1, 2014-05-16T18:05Z flytta din map variabel ovanför din kod som körs: ``` function initialize() { var map_canvas = document.getElementById('map_canvas'); var map_options = { center: new google.maps.LatLng(59.37066659999999, 17.975824800000055), zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP }; var locations = [ ['Sundbybergs BGK', 59.37066659999999, 17.975824800000055, 'http://www.bangolfkartan.se/gfx/markers/golf-icon.png'], ['Solna BGK', 59.370096770101284, 17.99651657696836, 'http://www.bangolfkartan.se/gfx/markers/golf-icon.png'], ['Tyresö BGK', 59.244784086003406, 18.237312592837498, 'http://www.bangolfkartan.se/gfx/markers/golf-icon.png'], ['Akalla-Kanaan 98 BGK', 59.4114427021035, 17.912663276196326, 'http://www.bangolfkartan.se/gfx/markers/golf-icon.png'], ['Norrtälje BGK', 59.754732583736114, 18.717763342852777, 'http://www.bangolfkartan.se/gfx/markers/golf-icon.png'] ]; var marker, i, location; var map = new google.maps.Map(map_canvas, map_options); var infowindow = new google.maps.InfoWindow(); for (i = 0; i < locations.length; i++) { location = locations[i]; marker = new google.maps.Marker({ position: new google.maps.LatLng(location[1], location[2]), map: map, icon: location[3] }); google.maps.event.addListener(marker, 'click', (function(marker, i) { return function() { infowindow.setContent(locations[i][0]); infowindow.open(map, marker); }; })(marker, i)); } } google.maps.event.addDomListener(window, 'load', initialize); ``` Permalänk: https://www.webforum.nu/p/2316198 ## #5 — Kolsyra, 2014-05-16T18:12Z @voigtann1, @metalboy Tack! /Kolsyra Permalänk: https://www.webforum.nu/p/2316199 --- Tråden på webben: https://www.webforum.nu/amne/javascript/192309-google-maps-egna-markers