So I noticed today that the Google attribution that is suppsoed to be with the map isn't showing up. Is there an easy way for me to put that on the map somewhere manually?
The map is being built using the Javascript v3 api. We're using html5/javascript, jquery and jquery mobile to build the content which apps on iOS and android running phone gap.
var myOptions = {
center: currentLocation,
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP,
panControl: false
};
map = new google.maps.Map(element[0], myOptions);
Thats how I'm setting up my map.
Edit: Found it! The first time I inspected the elements of the page I couldn't find the content for the attribution info but I found it this morning. It seems something else was setting the heigh of my map div which was pushing the copyright info of the screen.
I don't believe there's any way to optionally get rid of the Google attribution in Maps API v3.
If it's just not appearing, that might be a bug in the Maps API. I wouldn't worry about it. Google will fix it if they care deeply about the attribution.
If you really think it's something you're doing and not a bug in the API, post some code and maybe someone can figure out what's up.
Related
I generate a Google Map like the following:
lat_lng = new google.maps.LatLng(51.165691, 10.451526);
mapOptions = {
zoom: 4,
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: lat_lng,
}
map = new google.maps.Map(document.getElementById('map'), mapOptions);
also i got multiple markers that are dynamically added to the map. So as far as i know there is no way in my case to do it without the javascript API.
My Question is:
Is there any way to open that generated map (with all options and markers) in google maps? (https://www.google.com/maps/ ...)
... unfortunately it is not enough to just use the fullscreen functionality of maps!
Thanks in advance :)
The correct answer is yes and no.
There is no way to do such thing on the official Google Maps site, however you can create a map in Google's My Maps. The url does start with 'https://www.google.com/maps'. You can easily add your markers via the UI and I believe it also supports some file formats to import a batch of markers easily. I think you can also set some of the options you want.
Here's an example of an existing map created with this technique.
The only other option I know is to use the Google Maps API to create your custom map with all your markers and options, as suggested by other users.
#JonathanChaplin was correct in his suggestion #FalcoB... if I understand you correctly...
Your aim is for a google map to display, and when it does it shows all map markers like this:
To achieve this you need to store information (such as lat and lng values) externally, like for example in a json file. I have done this previously and my bit of code was simply:
//loads the data from json file resulting in markers being displayed
map.data.loadGeoJson('../upload/file.json');
Google has published documentation on this which can be viewed here:
https://developers.google.com/maps/documentation/javascript/importing_data
I think you can't put the map in google maps, but you can display full screen in your webpage.
I'm building an angular app in which I require user profile images to be shown on google map as markers.
The location comes from an API as JSON with Lat, long and images of user.
Plus, I'm using clustering in maps. Whenever I click the cluster, the markers with images should appear.
I'm trying it both AGM maps library as well as Google Maps Javascript API
Is there a way to do it?
To use custom markers and use your own images. You simply have to pass the url of your image to the an icon property of the Marker object as below...
var marker = new google.maps.Marker({
position: point,
icon: 'http://contoso.com/image.png',
map: map
});
if you need more control over that image and how it is rendered. Google Maps API provides and icon object specification you can use
var icon = {
url: 'http:contoso.com/image.png',
anchor: new google.maps.Point(0, 0)
}
There are a lot of documentation and examples in Google Maps APIs website
If you don't want to use google maps default marker and want to add custom HTML to markers,
Check this plugin out - https://github.com/googlemaps/js-rich-marker
Really easy plugin to use HTML as google maps markers.
Note - Basically this plugin uses custom overlay as markers. So, compared with default google maps markers, I think using this makes the map becomes a bit heavy to pan around when there are many markers (especially on smartphone)
I'm using Google Maps SDK for iOS to develop an based-map app. Map also shows many commercial locations like hotels, restaurants, companies,... It's bad for my app in some cases so I want to hide them, just show some information such as street name, parks name or some general places name.
I got the topic that handled the problem but in Javascript
google maps api: how to disable commercial locations?
There was another topic said that changing map type is a acceptable option
How to hide default labels on Google Maps iOS SDK
but there is no mapType suit for me, I want a normal type map.
Is there any solution for this using Google Map api on iOS
You can give mapTypeId.ROADMAP a try. It's one of the simplest map UIs. It doesn't show the commercial locations you're so trying to avoid.
var mapOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
Read here to browse more about simple maps.
This is only happening for me on Safari (v7.1.7). My custom markers have what appears to be white map gridlines appearing. I don't know if this is a problem with my code, a problem with Safari, or a problem with Google Maps.
EDITED TO ADD
Link to page affected: http://momentumdevelopments.ca/2015new-preview/projects/bpr-lofts/
I think this might be a js conflict somewhere on the page, as I can't get the same thing to happen on a JS Fiddle.
I know this is an old question, but adding "optimized: false" to marker config fixed this issue in safari for me:
marker = new google.maps.Marker({
position: LatLng,
map: map,
optimized: false
});
Also found this solution here: Google Maps - Strange vertical and horizontal lines at certain zoom levels in Safari
This behaviour may be a result of a custom browser-zoom, so check if the browser-zoom is set to default
I'm trying a code gogole maps with cordoba with 2 different emulators , ripple chroome and the Android emulator normal .
Ripple works and shows me a map geographic location , while the emulator Android rest a whole screen gray .
Why ?
I think the emulator is just failed to report its location.
And later I realized what is making that gray screen is we did not handle time-out probably. When we are getting the user location, it might take forever before the browser returns the location. Best practice is to first set a location and then update the maps later when the location becomes available. Also we should set the timeout for the geolocation too, as it is default to be Infinity.
I created a jsfiddle for that.
http://jsfiddle.net/x1115zw3/1/
=-=-=-=
To put the map in HYBRID, you should add mapTypeId: google.maps.MapTypeId.HYBRID in the maps option. So you mapOptions should looks like:
var mapOptions = {
zoom: 14,
mapTypeId: google.maps.MapTypeId.HYBRID
};