After a while, Google Maps seems to change the property name (Qa or Pa) to Na or another name.
var map;
function initialize() {
var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
var myOptions = {
zoom: 4,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
google.maps.event.addListener(map, 'click', function(event) {
AlertPos(event.latLng);
});
}
function AlertPos (location) {
// try to show the latitude and longitude
document.getElementById('lat').value = location.Qa;
document.getElementById('long').value = location.Pa;
alert(location.Qa)
alert(location.Pa)
}
This affects my application. Can any body help?
Use lat() and lng():
function AlertPos (location) {
// try to show the latitude and longitude
document.getElementById('lat').value = location.lat();
document.getElementById('long').value = location.lng();
alert(location.lat());
alert(location.lng());
}
Related
I have three layers that I would like to show up on my map, but none of them are showing up. Is there something wrong with my initialize() function? I've made all the correct declarations within the script tag, so I don't know where else the problem would be.
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng (37.80, -122.27);
var mapOptions =
{
zoom: 13,
zoomControl: true,
mapTypeControl: false,
panControl: false,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var image = 'css-js/images/hospitalicon-24.png';
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
//Fire Stations
var mapsEngineLayer = new google.maps.visualization.MapsEngineLayer({
layerId: '08042600090929941501-16143158689603361093',
map: map
});
//Hospitals
var mapsEngineLayer1 = new google.maps.visualization.MapsEngineLayer({
layerId: '08042600090929941501-08112974690991164587',
map: map
});
//Police Stations
var mapsEngineLayer2 = new google.maps.visualization.MapsEngineLayer({
layerId: '08042600090929941501-11613121305523030954',
map: map
});
}
I want to import kml files that contains more than 2000 placemarks into googla map.
I use google api v3.
I can only show 200 placemarks.
I know that I can use more layers, but I want only one because I have to refresh it weekly and I don't want to split every time.
Thanks for your replays
THIS IS THE CODE:
<script>
var map;
function initialize() {
var mapOptions = {
zoom: 8,
center: new google.maps.LatLng(47.25,19.5),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
loadKmlLayer(map);
}
function loadKmlLayer(map) {
var ctaLayer2 = new google.maps.KmlLayer('https://.../asdf.kml', {
suppressInfoWindows: false,
preserveViewport: false,
map: map
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
If your KML isn't very complex, you could try rendering it with a third-party KML parser (geoxml3 or geoxml-v3), see if that works (or points to the problem you are having with KmlLayer)
(function() {
window.onload = function() {
// Creating a new map
var map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(47.10,19.5),
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
// Creating the JSON data
var json = [
DATA HERE LIKE:
{"title" :"City ZIP CODE STREET" , "lat" :47.2876 , "lng" :20.4978 ,"description" :"YOUR DESCRIPTION"},
]
// Creating a global infoWindow object that will be reused by all markers
var infoWindow = new google.maps.InfoWindow();
// Looping through the JSON data
for (var i = 0, length = json.length; i < length; i++)
{
var data = json[i],
latLng = new google.maps.LatLng(data.lat, data.lng);
// Creating a marker and putting it on the map
var marker = new google.maps.Marker({
position: latLng,
map: map,
title: data.title,
// icon: iconimage
});
// Creating a closure to retain the correct data, notice how I pass the current data in the loop into the closure (marker, data)
(function(marker, data) {
// Attaching a click event to the current marker
google.maps.event.addListener(marker, "click", function(e) {
infoWindow.setContent(data.description);
infoWindow.open(map, marker);
});
})
//OnClick event
(marker, data);
}
} })();
I have a very simple set up of a google map. I want to interact with the map using a link outside of the map, so I'm using google.maps.event.addDomListener(), but my events are not being detected. Can anyone help? Jsfiddle here: http://jsfiddle.net/kqUwE/4/
function initialize() {
var myLatlng = new google.maps.LatLng(51.507, -0.1275);
var myOptions = {
zoom: 10,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
google.maps.event.addDomListener(document.getElementById("click_me", 'click', function () {
alert(document.getElementById("click_me"));
}));
}
window.onload = function() {
initialize();
};
Solved it:
Misplaced bracket, should be this instead:
google.maps.event.addDomListener(document.getElementById("click_me"), 'click', function () {
alert(document.getElementById("click_me"));
});
Hi,
that's normal code at Google
var map;
function initialize()
{
var latLng = new google.maps.LatLng(41.079120183660486, 28.994637246032653);
var mapOptions = {
center: latLng,
zoom: 8,
mapTypeId : google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
var marker = new google.maps.Marker({
position: map.getCenter(),
map: map,
});
google.maps.event.addListener(map, 'click', function (event) {
//map.setZoom(9);
//map.setCenter(marker.getPosition());
});
}google.maps.event.addDomListener(window, 'load', initialize);
and I want to multiply marker from my DB and I can't do it. I searched in site but always result is gray map.
And my code is:
<script type="text/javascript">
var map;
var latLng;
function initialize() {
var mapOptions = {
//center: latLng,
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
var markers = [];
#foreach (var item in Model)
{
#:markers.push("#item.map")
// item.map content coming like this : 41.079120183660486,28.994637246032653
}
for (var i = 0; i < markers.length; i++) {
var marker = new google.maps.Marker({
position: latLng,
map: map,
});
}
//google.maps.event.addListener(map, 'click', function (event) {
// //map.setZoom(9);
// map.setCenter(marker.getPosition());
// //placeMarker(event.latLng);
//});
}
google.maps.event.addDomListener(window, 'load', initialize);
I can't add markers. I think missing a lot of things? I really need your opinion. Thanks
Based on your code, it looks like you're adding markers to the same lat/lng. The code below adds a few markers in a loop.
<script>
var map;
var center = new google.maps.LatLng(39.715, -84.103);
$(document).ready(initialize);
function initialize() {
// Create map
var mapOptions = {
zoom: 10,
center: center,
panControl: false,
zoomControl: true,
mapTypeControl: true,
scaleControl: true,
streetViewControl: true,
overviewMapControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map($('#map_canvas')[0], mapOptions);
for (var ii = 0; ii < 5; ii++) {
var lat = center.lat() + (0.1 * ii);
var lng = center.lng() + (0.1 * ii);
var loc = new google.maps.LatLng(lat, lng);
var marker = new google.maps.Marker({
position: loc,
map: map
});
}
}
</script>
I'm looking for a method to my Google map auto refresh for each "n" seconds, now i'm refreshing all page, but i must to refresh only the map,
follow my JS code:
var DEFAULT_ZOOM = 14;
function initialize() {
var map;
var latlng = new google.maps.LatLng(-19.0, -59.0);
var myOptions = {
zoom: parseInt(getCookie("zoom_gm")),
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
initMarkers(map);
var zm = DEFAULT_ZOOM;
google.maps.event.addListener(map, 'zoom_changed',
function(){
zm = map.getZoom();
setCookie("zoom_gm", zm);
}
);
}
You will have to retrieve the new data using AJAX. Once you received the data, you have to walk the array/object you've received and add the new Markers. Depending on what you receive(maybe the response contains coordinates you've already set) you need to remove existing markers by using markerObj.setMap(null) .
That's all I can suggest so far, you're very stingy with informations.