possible to highlight a section of a street? - google-maps

I need to highlight a section of a street between two intersections. I have found a similar question which was asked more than a year ago (see here) which says that Google, Bing, etc. do not provide street data through their APIs. Does anyone know if anything has changed in the APIs, and whether I can get street location latitude/longitude data from somewhere now?

I have done this in API V2, but it should not be to difficult to rewrite it for V3.
Have a look at this website http://www.fvs.de/anfahrt.php (in German) and click the "Weg in Karte zeigen" buttons ("show way in map") in the sections below the map. Each button highlights another street line in the map.
It is basically done by using directions object of Google Maps to plot a route between two arbitrary street points in the map (e.g. your two intersections). The points must be encoded with their LatLng coordinates. Here is a code example (as said this is API V2):
function initMap() { // called by page onload event
if (GBrowserIsCompatible()) {
// Display the map, with some controls and set the initial location
gMap = new GMap2(document.getElementById("map_canvas"));
gMap.addControl(new GLargeMapControl());
// ...
gMap.setCenter(GLatLng(49.238326, 6.977761), 15);
// init directions object and attach listener to handle route loads from function highliteRoute()
gDir = new GDirections();
gPoly = null;
GEvent.addListener(gDir, 'load', function(){
gPoly = gDir.getPolyline();
gMap.addOverlay(gPoly);
// zoom & pan to poly
var polyBds = gPoly.getBounds();
var polyZoom = gMap.getBoundsZoomLevel(polyBds);
gMap.setZoom(polyZoom);
gMap.panTo(polyBds.getCenter());
});
}
}
function highliteRoute(){
if(gPoly!=null) gPoly.hide();
gDir.load('from: 49.313530,6.969109 to: 49.238326,6.977761', {getPolyline:true});
}

Related

Convert markerCluster into a pie chart in google maps

I am currently working on making clustered google maps. I have managed to cluster the markers. I have two types of markers in my map. Now when i cluster these, I can not show the underlying markers into groups.
I want to convert them into pie chart. Each marker count having their weight in the pie chart. Just like the below image.
Chart Marker Clusterer
I have also read about MarkerClustererPlus. But there are no examples using this in maps.
http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclustererplus/
This link is not working. If there is any other documentation about this plz share.
I have two different types of marker in my map. When these two types of marker gets clustered, The cluster should become a pie chart which contains the weight of these two in proportionate to the underlying marker count.
If there is anything related to this please answer. Thanks.
All that you nead is here https://github.com/hassanlatif/chart-marker-clusterer
Traffic_accidents.json - is your data for simple_example.html
var accident_injuries = data.features[i].properties["5074"]; // Some like category ...
Then set data for your pie chart (group and title):
switch (Number(accident_injuries)) {
case 1:
accident_title = "Fatal";
break;
case 3:
accident_title = "Serious injuries";
break;
case 2:
accident_title = "Very serious injuries";
........
Set your up marker
var accident_LatLng = new google.maps.LatLng(Number(accident_lnglat[1]), Number(accident_lnglat[0]));
var marker = new google.maps.Marker({
position: accident_LatLng,
title: accident_title
});
Then push it into array
markers.push(marker);
After for loop just generate cluster
var markerCluster = new MarkerClusterer(map, markers, opt);
And thats all. Voalaa

Google maps using android studio

I am developing an application which requires to mark the current location of an user onto google maps. I have already got the code for setting up a marker on the current location.
private void handleNewLocation(Location location) {
Log.d(TAG, location.toString());
//get the new latitude and longitude
double currentLatitude = location.getLatitude();
double currentLongitude = location.getLongitude();
//create object to store them
LatLng latLng = new LatLng(currentLatitude, currentLongitude);
//create marker with the new position
MarkerOptions options = new MarkerOptions()
.position(latLng)
.title("I am here!");
//add marker to the map
mMap.addMarker(options);
//move camera to current location
mMap.moveCamera(CameraUpdateFactory.newLatLng(latLng));
}
There are no errors shown on compilation. But when running on emulator , it displays "MapActivity has stopped working".
I am using Nexus 5 API 21x86 android virtual device to run the app.
Please help !!!!!!!
I think there is lots of problems, please refer to here, do it step by step, you will get the map.
Also, for the Marker part, please refer to here.

Control Google Map zoom level with a hyperlink

How can I control the Zoom Level of my Google Map with hyperlinks? For instance I want three defined levels (Location in UK, UK in Europe, Europe in the World). Clicking on these links will display the map with a different zoom level.
I'm using Google Maps API v3
That shouldn't be too difficult to do.
When you create the map, you get a reference to the map object, e.g.
var mapOptions = {mapTypeId: google.maps.MapTypeId.TERRAIN};
var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
Once you have the object, you can zoom to a specific level like this:
function zoomToLevel() {
map.setZoom(8);
}
So you'd just need to set the click event of your hyperlink to run the javascript function:
Zoom to level 8
For what you're doing though, it might be better to get the map to select it's own zoom level based on the area. This function is actually zooming to show the Pyrenees, but the idea could be used for any area, as long as your points are at diagonally opposite corners:
function zoomPyrenees() {
var startPoint;
var endPoint;
var boundsPyrenees;
startPoint = new google.maps.LatLng(43.373403, -1.774107);
endPoint = new google.maps.LatLng(42.482463, 3.129875);
boundsPyrenees = new google.maps.LatLngBounds();
boundsPyrenees.extend(startPoint);
boundsPyrenees.extend(endPoint);
map.fitBounds(boundsPyrenees);
}

Calling map.fitBounds() Multiple Times in Google Maps API v3.0

I've just begun using the Google Maps API (v3.0) and have had a good deal of success so far. I am loading a set of objects with Latitude & Longitude values from a database, passing them into my script, and looping over them in the script in order to add them to the map.
I am using the "bounds.extend() / map.fitBounds()" method of setting the map's zoom & bounds (see code below), which works as expected the first time around; however, if I clear out the existing markers, fetch another set of objects, and do the same thing on the same map instance, it sets the bounds incorrectly, usually resulting in a minimum zoom (an astronaut's view).
My suspicion is that my map object has some memory of the previous set of bounds that I've given it and that I need to find a way to clear these bounds before assigning my new ones, but I really can't be too sure.
Any help is greatly appreciated!
var locationList = [];
for (var i = 0; i < mapPoints.length; i++) { // mapPoints is a collection of DTOs
var mapPoint = mapPoints[i];
var location = new google.maps.LatLng(mapPoint.Latitude, mapPoint.Longitude);
locationList.push(location);
var marker = new google.maps.Marker({
map: map,
icon: '/Content/images/map/' + mapPoint.Status.Icon,
shadow: '/Content/images/map/shadow.png',
position: location
});
markers.push(marker); // markers is an Array that is managed outside this loop
}
var bounds = new google.maps.LatLngBounds();
for (var j = 0; j < locationList.length; j++)
bounds.extend(locationList[j]);
map.fitBounds(bounds);
This isn't the answer, so to speak, but a (slightly hacky) workaround that I discovered on a thread in the Google Maps Javascript API v3 group:
//map.fitBounds(bounds);
setTimeout( function() { map.fitBounds( bounds ); }, 1 );
if the above answer doesn't work for you (it didn't for me), the problem might lie in bootstrap (assuming you're using it). bootstrap modals specifically generate all sorts of wonky behaviour when i embed a map object in it.. curiously correcting itself if/when i drop an 'alert' in there.. in any case, i solved all my problems by just building my own modal (ie, not using bootstraps modals).

Marker Manager not showing markers

I am having problems using the MarkerManager. Somehow Markers added with the MarkerManager do not show up, though i do mgr.refresh(); It works when i use basic map.addOverlay(marker); but not when using mgr.addMarker(marker);. Weird. Hope someone here can help.
Here's the relevant code:
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map"));
bounds = new GLatLngBounds();
map.setCenter(new GLatLng(48.25, 11.00), 4);
mgr = new MarkerManager(map, mgr_options);
markers = createSpotMarkers(spots); // parsing spots, extending bounds, creating Array of GMarkers etc, pretty basic and seems not be relevant.
mgr.addMarkers(markers); // does not work
map.addOverlay(markers[0]); // works
mgr.addMarker(markers[0]); // does not work either
map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds)-1);
mgr.refresh();
}
It looks like the API for MarkerManager expects 3 arguments to addMarkers, of which the 3rd seems to be optional. The second, however, doesn't. If the API doesn't help, then a blog post showing example usage might. Good luck!