This shows you the differences between two versions of the page.
web-mapa [2017/05/26 09:09] mapix |
web-mapa [2018/01/07 15:18] |
||
---|---|---|---|
Line 1: | Line 1: | ||
- | ====== Vložení mapy průvodců na web ====== | ||
- | Pro vložení mapy se všemi vašimi průvodci na webovou stránku vložte tento kód: | ||
- | |||
- | <code> | ||
- | <head> | ||
- | <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> | ||
- | </head> | ||
- | |||
- | <body> | ||
- | <div id="googleMap" style="height:500px;">...</div> | ||
- | | ||
- | <script> | ||
- | var publisherId = <ID vydavatele>; | ||
- | | ||
- | var kmlUrl = "http://muj.mapix.cz/API/GetPackagesKml?publisherId=" + publisherId; | ||
- | var packagesInfoUrl = "http://muj.mapix.aconte.cz/API/GetPackagesInfo?publisherId=" + publisherId; | ||
- | | ||
- | var detailLevel = 0; | ||
- | | ||
- | function initialize() { | ||
- | $.getJSON(packagesInfoUrl, function(data) { | ||
- | var mapProp = { | ||
- | center: new google.maps.LatLng(data.ViewportSettings.Latitude, data.ViewportSettings.Longtitude), | ||
- | zoom: 15, | ||
- | minZoom: 3, | ||
- | mapTypeId: google.maps.MapTypeId.TERRAIN | ||
- | }; | ||
- | var map = new google.maps.Map(document.getElementById("googleMap"), mapProp); | ||
- | | ||
- | kmlUrl = kmlUrl + '&dummy=' + (new Date()).getTime(); | ||
- | | ||
- | var kmlOptions = { | ||
- | suppressInfoWindows: false, | ||
- | preserveViewport: data.ViewportSettings.PreserveViewPoint, | ||
- | scaleControl: true, | ||
- | map: map | ||
- | }; | ||
- | var kmlLayer = new google.maps.KmlLayer(kmlUrl, kmlOptions); | ||
- | }); | ||
- | } | ||
- | | ||
- | </script> | ||
- | <script async defer src="https://maps.googleapis.com/maps/api/js?key=<Google API key>&callback=initialize" type="text/javascript"></script> | ||
- | </body> | ||
- | </code> | ||
- | |||
- | V kódu je nutno vyplnit <ID vydavatele> identifikátorem vašeho účtu a <Google API key> za klíč pro Google mapy pro váš web (viz [[https://developers.google.com/maps/documentation/javascript/get-api-key]]). |