I have two problems.
1 ) I have a google map with a marker and the label applied to it goes right through the center of the marker. Ideally I would like it above the marker, but at this point I'll take anything. Here's what I have.
var m:Marker = new Marker(new LatLng(tempLat,tempLang),new MarkerOptions({label:"Hello World"}))
2 ) I have the same problem with the infoWindow. It completely covers the marker. Here's the code.
map.openInfoWindow(new LatLng(tempLat,tempLang), new InfoWindowOptions({title: "Hello", content: "World"}))
Thank You.
I don't think there's any answer for the marker label, but for the InfoWindow this is what I have.
map.openInfoWindow(new LatLng(tempLat,tempLang), new InfoWindowOptions({title: storeName, content: to.text, hasTail:true, pointOffset: new Point(0, -40)}));
Related
I have markers which use MarkerImage on my map.
The problem is I'm trying to shift the marker image so the icon centre is on the exact coordinate position.
I doesn't work.
My code is:
var image = new google.maps.MarkerImage(icon,
// This marker is 15 pixels wide by 15 pixels tall.
new google.maps.Size(15, 15),
new google.maps.Point(7,7),
new google.maps.Point(7,7)
);
var marker = new google.maps.Marker({
position: new google.maps.LatLng(lat, lon),
map: map,
title: title,
icon: icon
});
Markers should be centred on the polylines as they mark object which are located on polylines. They appear next to it on my map.
Ok. I had icon instead of image inserted in my marker so it didn't see the shifted image.
Besides MarkerImage has changed to Icon type in the reference since version 3.11 so it was worth amending too.
I’ve just built up a customized tiles map site : http://shuttle.wanglingjie.net/memoire/memoire.html.
But I have a trouble with making a marker on it. Once I added the new marker code:
var marker = new google.maps.Marker(
{
position: new google.maps.LatLng(0, 0),
map: map
}
);
The maker doesn’t show up and the js reports an error with the following message:
Uncaught Error: Invalid value for property : [object HTMLDivElement]
Any ideas? Thank you for your attention. :)
map is null. In firebug, your site gives this error:
map is not defined
http://shuttle.wanglingjie.net/memoire/memoire.html
Line 129
Your javascript code is badly laid out, so it is hard to see what you have done wrong. I think the problem is that your window.onload function does not have a closing bracket: }.
You should lay your javascript out so that all code contained within brackets has the same amount of indent. For instance, the code you have posted should look like this:
var marker = new google.maps.Marker(
{
position: new google.maps.LatLng(0, 0),
map: map
}
);
It's also acceptable to write it like this:
var marker = new google.maps.Marker({
position: new google.maps.LatLng(0, 0),
map: map
});
This makes your code easier to read, and will help you find bugs.
If you need more help, please edit your question to include the full body of your function, correctly formatted.
From the source code given in the link I noticed that the block that creates the marker is outside the function that creates the map. That's why the marker doesn't see the variable map.
when i search for nearby locations on the site i am workign on the results show up in a list but the map area is just grayed out sometimes it comes back but then goes away.
any help would be greatly appreciated
This is a response to your question on the first answer. His idea is right that you need to initialize it with a location before anything can be visible. Also please note that this is a question about V3, the first answer addresses the syntax of V2. Please try the code below using the same idea as the v2 post.
Set the center value in the map options with your initial location. You can also adjust the zoom here.
var mapOptions = {
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: new google.maps.LatLng(latitude, longitude)
};
var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
The timing of initializing is important. Is the map visible at the moment the page loads, or does it pop up/fade in/(whatever that changes the state from invisible to visible)?
If the map is hidden at the moment of initializing, the map will be grey.
In v3, check your Lat and Lng are OK and are not "undefined".
console.log(results[0].geometry.location.k);
console.log(results[0].geometry.location.D);
var mapOptions = {
zoom: 15,
center: new google.maps.LatLng(
results[0].geometry.location.k,
results[0].geometry.location.D
)
};
map = new google.maps.Map(document.getElementById('map-canvas'),mapOptions);
Based on my experience working with google maps, sometimes the gray patches appear when there is no available map data at the location you are currently previewing (esp. when the zoom factor is high), or when you internet connection is slow, such that map data takes long to load / fails!
But other factors could also be a cause -- maybe.
When you initialize your map, say for example:
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
the seconds parameter to the map.setCenter is the zoom factor - in this case 13.
you can also set a new zoom level for the map like this:
map.setZoom(5);
Read more here...
There are about 100 markers on a google map plus there is one special marker that needs to be visible. Currently, the markers around it hide it totally or partially when the map is zoomed out. I need that marker to be fully visible and I think keeping it on top of all other markers should do the trick. But I cannot find a way to modify its stacking order (z-index).
This is for Google Maps API 2.
For Google Maps API 3 use the setZIndex(zIndex:number) of the marker.
See:
http://code.google.com/apis/maps/documentation/javascript/reference.html#Marker
Use the zIndexProcess option in GMarkerOptions when you create the marker that you want on top. For example:
var pt = new GLatLng(42.2659, -83.74861);
var marker = new GMarker(pt, {zIndexProcess: function() { return 9999; }});
map.addOverlay(marker);
I believe the default is to have a z-index that is the latitude of the point of the marker, so this should be fairly safe at bringing a single marker to the front. Further, this was just a simple example; you can set the z-index of all your markers in whatever simple or complex way you want. Another example is to have two functions: one for special markers and one for the rest.
var pt1 = new GLatLng(42.2659, -83.74861);
var pt2 = new GLatLng(42.3000, -83.74000);
var marker1 = new GMarker(pt1, {zIndexProcess: specialMarker});
var marker2 = new GMarker(pt2, {zIndexProcess: normalMarker});
map.addOverlay(marker1);
map.addOverlay(marker2);
function specialMarker() {
return 9999;
}
function normalMarker() {
return Math.floor(Math.random()*1000);
}
Adding on to jhanifen's answer, if you want to get your one special marker to be on top of all the rest, set it's zIndex to google.maps.Marker.MAX_ZINDEX + 1. This will make sure that it is on top of any marker on the map.
I'm creating a Google map to display multiple points with each point having a short text label. I found a JavaScript library that lets me label the markers easily. I would also like to make the markers draggable. I'm working from this example.
http://gmaps-utility-library.googlecode.com/svn/trunk/mapiconmaker/1.1/examples/createflaticon-simple.html
I tried the following, but it doesn't work, at least in Firefox 3.04.
var newIcon = MapIconMaker.createFlatIcon({ draggable: "true", label: "12300" });
var point = new GLatLng(43.82589,-79.10040);
var marker = new GMarker(point, {icon: newIcon});
map.addOverlay(marker);
marker.enableDragging();
Any suggestions?
http://code.google.com/apis/ajax/playground/?exp=maps#map_marker_drag
This should get ya there
Cheers