Insertar google maps con una ruta personalizada (realizada en un archivo .kml)

[laura Gómez]

I don't know to do it.

I try with this code:

function googleMapFunction (){
var myOptions = {
zoom :13,
center: new google.maps.LatLng(38.8600, -0.4796),
mapTypeId: google.maps.MapTypeId.ROADMAP
};

var map = new google.maps.Map($('div[dsid="googlemap_1"]').get(0), myOptions);

var sfLatlng = new google.maps.LatLng(38.8167, -0.6167);
var marker = new google.maps.Marker({
position: sfLatlng,
map: map,
title: "Ontinyent",
icon: "http://i.imgur.com/QtWkT.png"
});

google.maps.event.addListener (marker, 'click', function () {
Appery.navigateTo ('rutaontinyent', {reverse: false});
});

var sjLatlng = new google.maps.LatLng(38.8394, -0.5202);
var marker = new google.maps.Marker({
position: sjLatlng,
map: map,
title: "Albaida"
icon: "http://i.imgur.com/QtWkT.png"
});

google.maps.event.addListener (marker, 'click', function () {
Appery.navigateTo ('Screen3', {reverse: false});
});

var sjLatlng = new google.maps.LatLng(38.7667, -0.667);
var marker = new google.maps.Marker({
position: sjLatlng,
map: map,
title: "Bocairent"
icon: "http://i.imgur.com/QtWkT.png"
});

google.maps.event.addListener (marker, 'click', function () {
Appery.navigateTo ('Screen3', {reverse: false});
});

var sjLatlng = new google.maps.LatLng(38..9435, -0.3337);
var marker = new google.maps.Marker({
position: sjLatlng,
map: map,
title: "Llutxent"
icon: "http://i.imgur.com/QtWkT.png"
});

google.maps.event.addListener (marker, 'click', function () {
Appery.navigateTo ('Screen3', {reverse: false});
});

}

But this code doesn't load.

[laura Gómez]

I try with:
function inizialite (){
var myOptions = {
zoom :13,
center: new google.maps.LatLng(38.8600, -0.4796),
mapTypeId: google.maps.MapTypeId.ROADMAP
};

var map = Appery("googlemap_1").gmap

var sfLatlng = new google.maps.LatLng(38.8167, -0.6167);
var marker = new google.maps.Marker({
position: sfLatlng,
map: map,
title: "Ontinyent",
icon: "http://i.imgur.com/QtWkT.png"
});

google.maps.event.addListener (marker, 'click', function () {
Appery.navigateTo ('rutaontinyent', {reverse: false});
});

var sjLatlng = new google.maps.LatLng(38.8394, -0.5202);
var marker = new google.maps.Marker({
position: sjLatlng,
map: map,
title: "Albaida"
icon: "http://i.imgur.com/QtWkT.png"
});

google.maps.event.addListener (marker, 'click', function () {
Appery.navigateTo ('Screen3', {reverse: false});
});

var sjLatlng = new google.maps.LatLng(38.7667, -0.667);
var marker = new google.maps.Marker({
position: sjLatlng,
map: map,
title: "Bocairent"
icon: "http://i.imgur.com/QtWkT.png"
});

google.maps.event.addListener (marker, 'click', function () {
Appery.navigateTo ('Screen3', {reverse: false});
});

var sjLatlng = new google.maps.LatLng(38..9435, -0.3337);
var marker = new google.maps.Marker({
position: sjLatlng,
map: map,
title: "Llutxent"
icon: "http://i.imgur.com/QtWkT.png"
});

google.maps.event.addListener (marker, 'click', function () {
Appery.navigateTo ('Screen3', {reverse: false});
});

google.maps.event.addDomListener(window, 'load',inizialite);

But But this code doesn't load.

[Maryna Brodina]

Hello! Where did you place this code? Please check are there any errors in console when you test app?

[laura Gómez]

I load in my screen.

event < portada (is my screen) < javascritp

Load my code.

This is my consola.

[Maryna Brodina]

Hi, you have errors in code:
1) between title and icon should be comma, for example:
prevar marker = new google&#46;maps&#46;Marker({
position: sjLatlng,
map: map,
title: "Llutxent",
icon: "http:&#47;&#47;i&#46;imgur&#46;com&#47;QtWkT&#46;png"
}); /pre
comma is missing in a few places
2) in code you have 38..9435, but it should be 38.9435
3) try to invoke this code on page Load event and when code is loaded check this post https://getsatisfaction.com/apperyio/...

[laura Gómez]

Thanks for your help!!!!!

[Mike6979865]

Hi, I tried this code on button click below, but nothing happens. What I want to do eventually is overlay a shape file that I have hosted some on the Appery Component. I want to then check whether a long/lat is in the polygon that is overlaid.

function initialize() {
var chicago = new google.maps.LatLng(41.875696,-87.624207);
var mapOptions = {
zoom: 11,
center: chicago,
mapTypeId: google.maps.MapTypeId.ROADMAP
}

var map = Appery("googlemap_1").gmap;

var ctaLayer = new google.maps.KmlLayer({
url: 'http://gmaps-samples.googlecode.com/s...'
});
ctaLayer.setMap(map);
}

google.maps.event.addDomListener(window, 'load', initialize);

[Alena Prykhodko]

Hello Mike,

Please try to debug code http://devcenter.appery.io/documentat...
Are there any error?