Diese Seite mit anderen teilen ...

Informationen zum Thema:
Forum:
WinDev Forum
Beiträge im Thema:
2
Erster Beitrag:
vor 3 Jahren, 2 Monaten
Letzter Beitrag:
vor 3 Jahren, 2 Monaten
Beteiligte Autoren:
Viggo Poulsen

WB18 Google map in HTML control

Startbeitrag von Viggo Poulsen am 27.11.2014 19:08

Hi there
I have succede (well, almost) in using Google maps API v3 in a HTML control.
I'll show the code later in this topic.

In a Dynamic AWP site I can do all. Make maps, markers etc. I can also replace the standard marker with my own png (ex. icon: '2.png' ).
In a Dynamic Webdev site I can make almost the same except the image is not shown. When placing the cursor where the image should be the cursor changes to 'move' so everything Works except the system cannot find the image file. In Dynamic AWP i just put the image in the _Web directory but in Dynamic Webdev it does'nt matter where i put it, it simply cannot be found.
Any help to this is much welcome.

Now for the code: The API key being used are my own but it Works fine with this key ( from http://www.w3schools.com/googleAPI/google_maps_overlays.asp )
The image 2.png are attached. It is a bit to big, but it Works.

This code are written in General of a HTML control:






html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map-canvas { height: 100% }




var myCenter=new google.maps.LatLng(56.82128493, 8.99939973);
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(56.82128493, 8.99939973),
zoom: 8
};
var map = new google.maps.Map(document.getElementById("map-canvas"),
mapOptions);
var marker=new google.maps.Marker({
position:myCenter,
icon: '2.png',
title:"Hello World!",
draggable: true
});
marker.setMap(map);

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








Dok: https://developers.google.com/maps/documentation/javascript/markers#add
Tutorial: http://www.w3schools.com/googleAPI/google_maps_basic.asp


Best regards
Viggo Poulsen
[attachment 1256 2.png]

Antworten:

Re: WB18 Google map in HTML control. With text and code this time.

Hi All

Very strange. Where did my message go ???

Anyway. I try Again:

I am working on implementing Google maps api V3 via a HTML control.
It Works, well almost. I can show maps, zoom, etc. But I have problems putting needles on the map (markers). Standard markers Work fine, but markers based on a PNG file does not Work.

In a Dynamic AWP site this Works fine. All the time.
In a Dynamic webdev site it does not Work. Never.
Guess what I need to Work with :-(

It seems like the HTML control simply cannot find the PNG file. If I hover the mouse over the place where the marker should be, the cursor changes and the title are shown, so the marker Works, just without showing itself.
I have placed the PNG file everywhere with no luck (

Now for the code. If you put this in a HTML control it should Work. The api key being used are one from this site: http://www.w3schools.com/googleAPI/google_maps_basic.asp . You should use your own.

Here you go:






html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map-canvas { height: 100% }




var myCenter=new google.maps.LatLng(56.82128493, 8.99939973);
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(56.82128493, 8.99939973),
zoom: 8
};
var map = new google.maps.Map(document.getElementById("map-canvas"),
mapOptions);
var marker=new google.maps.Marker({
position:myCenter,
title:"Hello World!",
draggable: true,
icon: '2.png'
});
marker.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);







Doc of Javascript: https://developers.google.com/maps/documentation/javascript/markers#add
Tutorial: http://www.w3schools.com/googleAPI/google_maps_basic.asp


Any help to get this working with a Dynamic webdev site are most welcome.
Best regards
Viggo Poulsen

von Viggo Poulsen - am 02.12.2014 10:22
Zur Information:
MySnip.de hat keinen Einfluss auf die Inhalte der Beiträge. Bitte kontaktieren Sie den Administrator des Forums bei Problemen oder Löschforderungen über die Kontaktseite.
Falls die Kontaktaufnahme mit dem Administrator des Forums fehlschlägt, kontaktieren Sie uns bitte über die in unserem Impressum angegebenen Daten.