Google Maps API - Customising the Appearance of certain controls - google-maps-api-3

We're using the Google Maps API and have noticed that the appearance of some of the controls have changed recently. For example the size of the zoom controls:
and the map type:
appear to have increased in font size. We've also noticed this icon in the bottom right corner above the zoom controls:
and not sure what this is and would like to hide this if possible. Is it possible to reduce the size of the zoom controls and the Map Type text, as well as remove this person icon?

It turns it was an issue with the latest 3.34 release of the Google Maps JavaScript API. I've managed to revert to the previous version for now, e.g. http://maps.google.com/maps/api/js?v=3.33&key=xxxxxxx

Related

Avoid pan and zoom of embedded OSM maps in Wordpress

I have several embedded maps on my website. The source of these maps are from....
Plugin WP GPX Maps
uMap (iframe)
I want to avoid panning and zooming when swiping with one finger on smartphone. Panning and zooming should be only possible by using two fingers.
Accordingly using a computer dragging and zooming should be only possible by pressing the CTRL-key when using the mouse.
Is there a plugin for Wordpress or a code for css or functions.php to realise this?
You can use the leaflet map plugin and set dragging to false and keep touchZoom on true.
See also: https://stackoverflow.com/a/41631385/288568

How to create an interactive map in ASP.NET

I've created a page that shows a map of my complex. The idea is to put icons on the map representing where computers are located, and the user will be able to click on the icon to remote into the machine.
But I also want the icons to be moveable. Everyone should be able to open the page and drag the computer icon around. Is this possible using only ASP.NET?
you can use following options but not limited :)
Google Maps
Bing Maps
bing map sdk
You could use the html <map> and <area> tags along with an image of your complex to create a map that has points on it.
You can see an example of this here, however this is probably overkill for your requirements. All you need to do is set the coord and shape attributes for each area, this will give you an element that would represent the computers.
I'm not sure if you can manipulate these in javascript or jQuery though, as I have never tried, but hopefully this will give you a starting point.

Google Maps API - Place Image outside a InfoWindow

I need to customize a Google Maps InfoWindow.
In particular I want an image to "hang over the edge" of the InfoWindow. But when I place the image absolute within the InfoWindow-DIV it disappears behind the border of my InfoWindow.
Adding a z-index changes nothing.
Hope I made my point clear. Any ideas?
There are many custom window solution , see this one for example:
http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobubble/examples/example.html
If you want something outside of the infoMarker border, you'd better use a custom solution.
The built in one is good for the simple stuff.

Specific way of selecting a location on a google map

I've inherited a small project. The person before me created a native app for iPhone, implemented in objective-c, and my job is to remake it as a webapp with PhoneGap for iOS and Android.
In my predecessor's original implementation, part of the app has the functionality of allowing the user to drop a marker on a map to select a location. I found a comparable way of doing this, but the supervisor wants the exact way she'd done it, which I'm having a little trouble with. Let me describe:
In her native app, the map appears with a marker in the center of it. The user then slides the map around beneath the marker (which stays in place on the screen), until the marker is positioned over the spot they want. Then they hit a button marked "Select," and those coordinates are sent to the app for irrelevant other operations.
I'm trying to do the exact same thing with the google-maps javascript api and html/css, and I can't figure it out. Do any of you Gmaps pros have any ideas?
You may observe the center_changed-Event of the map. When it fires set the position of the marker to the new center of the map.
Another suggestion:
For a better effect instead of a marker you may use a custom control. You may insert a marker-image there so it will look like a marker. To place it in the center, push the control to
map.controls[google.maps.ControlPosition.RIGHT_CENTER]
(it will be vertically centered then) and apply the horizontal centering by adding a right-margin to the control

Bing map silverlight control content rendering issue when page gets refresh

When Bing map control loads for first time on any browser all pushpin on map are visible.
Bing map control renders perfectly.
Then I refresh browser it create rendering issue some custom pushpin on map gets disappeared. This behavior continues with pushpin. Pushpin are (.png) images and I am not using default bing map thumbtacks.
May be it is issue of browser caching content or Bing map control rendering issues on various browsers.
Please respond soon.
Convert .png to xaml then pushpin disapper issues will be solved
Making pushpin silverlight native(.xaml) will solve the problem
Its a browser cache issues that makes .png pin disapper

Resources