Google Maps showing wrong current location - google-maps

I am using google maps in my sencha touch application. And I am using current location as true. But some time I am getting my current location different some time.
Below is the code I have used to show map.
this.map = new Ext.Map({
mapOptions : {
zoom: 12,
navigationControlOptions: {
style: google.maps.NavigationControlStyle.DEFAULT
}
},
useCurrentLocation: true,
});

Related

Google maps API v3 - Polyline with symboles duplicated at wrong place - google chrome

While creating a polyline with a sequence of symboles,
Seems like some html "canvas" are duplicated,
and displayed at wrong places on the map.
The bug occurs on "google chrome".
Attached a screenshot.
Also attached a link to js-fiddle.
link to js-fiddle - please view on google chrome
function initialize() {
var gm = google.maps,
mapOptions = {
zoom: 17,
center: new gm.LatLng(55.685336941597804, 21.11585641885563),
mapTypeId: gm.MapTypeId.ROADMAP
},
map = new gm.Map(document.getElementById('map_canvas'), mapOptions),
points = [
//new gm.LatLng(55.685025, 21.11899500000004),
new gm.LatLng(55.683228369431774, 21.11899500000004),
new gm.LatLng(55.68333671468528, 21.117905037957826),
new gm.LatLng(55.68364868408562, 21.116946525082994),
new gm.LatLng(55.68412665376389, 21.116235063478825),
new gm.LatLng(55.6847129783503, 21.11585646893286),
new gm.LatLng(55.685336941597804, 21.11585641885563),
new gm.LatLng(55.6859232843305, 21.116234936678893),
new gm.LatLng(55.685025, 21.11899500000004)
],
iconSequence = {
icon: {
path: gm.SymbolPath.FORWARD_CLOSED_ARROW
},
repeat: '12px',
},
line = new gm.Polyline({
map: map,
path: points,
icons: [iconSequence]
});
}
google.maps.event.addDomListener(window, 'load', initialize);
The bug has resolved at Chrome version: 60.
(It is reproduceable at Chrome 59).
Thanks a lot!

Can I check if Google Maps embedded map (iframe) has a marker?

I have been searching for this topic but I dont see any article discussing about checking if google maps embed has a marker. I have data from the database that is dynamically inserted to the params of embed map. Im asking about this because some data inserted in the embed maps only shows the world map not the exact location and no marker. Any possible ways to check if it has a marker or not?
Do you not need to set the location and marker using the API and say e.g. data-widget...
API docs: google.Maps reference
We have something like;
// Map instance
state.map = new google.maps.Map(el, {
center: state.latLngObj,
zoom: state.zoom,
maxZoom: 18,
mapTypeControl: false,
panControl: false,
streetViewControl: false,
scrollwheel: !data.disableScroll,
draggable: mapDraggable,
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL
},
mapTypeId: state.style
});
state.marker.setMap(state.map);

Google Maps API v3: Disable the dropdown menu off the default MapTypeControl

QUESTION:
Is it possible to hide the dropdown menu off the MapTypeControl?
(Nothing found in the Google Maps API v3 documentation).
DESCRIPTION:
I'm using the default control with google.maps.MapTypeControlStyle.HORIZONTAL_BAR style and i don't want to create a custom control.
MapTypeControl:
MapTypeControl with dropdown menu on mouseover:
Javascript:
var mapOptions = {
...
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
},
};
map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
The MapTypeId.TERRAIN control looks to get added as a drop-down. Do you need it? If not, you can use the following code
var mapOptions = {
...
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
mapTypeIds: [
google.maps.MapTypeId.ROADMAP,
google.maps.MapTypeId.SATELLITE
]
},
};
map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

Maps API not showing border which was visible is google maps

I am using Google maps API for my project.
var elevator;
var myOptions = {
zoom: 3,
center: new google.maps.LatLng(55.50, -129.35),
mapTypeId: 'terrain'
};
map = new google.maps.Map($('#map_canvas')[0], myOptions);
var address="CA,state"
$.getJSON('http://maps.googleapis.com/maps/api/geocode/json?address='+address+'&sensor=false', null, function (data) {
var p = data.results[0].geometry.location
var latlng = new google.maps.LatLng(p.lat, p.lng);
new google.maps.Marker({
position: latlng,
map: map
});
});
Google Maps CA in maps.google.com
In My App through API
California Boundary is not shown in map which drawn through API. Any help will be useful.
Google Maps API leaves to the user the job of implementing anything outside the basic features.
Google Maps shares a lot of features in common with Google Maps API but it has always had an edge over his little brother.
For this particular case, you could use a google.maps.KmlLayer to display your desired boundaries. For this, you need a publicly available kml file. This means, if you find said kml, storing it in your public dropbox folder would suffice. Also, there's a size limit on kml files, so don't get carried away.
I guess you need more than just California, but here's an example just for CA
var map = new google.maps.Map(document.getElementById("map"), {
zoom: 5,
disableDefaultUI: true,
zoomControl: true,
center: new google.maps.LatLng(38, -111),
mapTypeId: "roadmap"
});
var ctaLayer = new google.maps.KmlLayer({
url: 'https://dl.dropboxusercontent.com/u/3133731/kml/california.kml',
map:map,
preserveViewport: true,
suppressInfoWindows: true
});
Here: I made you a jsFiddle.

Can I style my current geographical position in google maps api V3

I am using google maps api v3. In my map the current position name is showing larger than other names, but it is not easy to me to find it in the fist time, so I thought to style my current position, like, bold the text, change the color of the text, I searched but no answer.
This is my code:
function initialize() {
var latlng = new google.maps.LatLng(geoip_latitude(),geoip_longitude());
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
},
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL
}
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
}
Can I add a option to var myOptions = { to style my current location. In this case my current location is `colombo.
I think the best you can do within the confines of the API is to place something (such as a Marker object) on your current location. I don't believe the API permits you to style some labels and not others (and if it does, then it is probably not a way that is documented and straightforward).