I check the documentation to update the position and I test this code but no work.
-(long long)updateMarkerPosition:(long) markerId:(double) lat: (double) lon{
GMSMarker *marker = (GMSMarker*) markerId;
marker.position = CLLocationCoordinate2DMake(lat, lon);
marker.tracksInfoWindowChanges = YES;
[mapView setSelectedMarker:marker];
[marker retain];
return marker;
}
Any people can help me?
Related
This is a portion of code I'm working on: (this legacy code is drawing Circle using Polygon paths:
GEvent.addListener(bigmap_rad, 'click', function(overlay, cpoint) {
var radius = document.getElementById('circle_radius').value;
var c_center = new GLatLng(cpoint.y,cpoint.x);
var c_marker = new GMarker(c_center);
var latOffset = 0.01;
var lonOffset = 0.01;
var latConv = c_center.distanceFrom(new GLatLng(c_center.lat()+0.1, c_center.lng()))/100;
var lngConv = c_center.distanceFrom(new GLatLng(c_center.lat(), c_center.lng()+0.1))/100;
// nodes = number of points to create polygon
var nodes = 40;
// Create an array of points
var cpoints = [];
var pointbegain = null;
// set the amount of steps from node
var step = parseInt(360/nodes);
// the for loop creates a series of points that define the circle, counting by the amount of steps, by 9 in the case of 40 nodes
for(var i=0; i<=360; i+=step){
var point1 = new GLatLng(c_center.lat() + (radius / latConv * Math.cos(i * Math.PI / 180)),
c_center.lng() + (radius / lngConv * Math.sin(i * Math.PI / 180)));
if(i==0){
pointbegain= point1;
}
cpoints.push(point1);
}
//cpoints.push(pointbegain);
polygon = new GPolygon(cpoints, "#000000", 1, 1, "#8000000", 0.5);
//bigmap_rad.addOverlay(polygon);
(Here bigmap_rad is a google map v2 Map object and cpoint is passed to that event listener)
I am using this google map v2 code to turn it into v3 . But stumbled on this
var c_center = new GLatLng(cpoint.y,cpoint.x);
I cant find the alternative of this cpoint.y and cpoint.x for google map api v3. Please someone suggest me the solution. Thanks in advance.
I think I got a solution. Just used this
var c_center = new google.maps.LatLng(event.latLng.lat(),event.latLng.lng());
in place of
var c_center = new GLatLng(cpoint.y,cpoint.x);
I had a similar issue and solved it by replacing the x and y with lat() and lng().
That would make your code be.
var c_center = new google.maps.LatLng(cpoint.lat(),cpoint.lng());
Maybe that could have worked and is a quick workaround that helped me.
ok so you need to have an event listener on the map for clicks. And you want to find out the point that's been clicked.
google.maps.event.addListener(map, 'click', function(event) {
console.log(event.latLng);
var yourCoordinates = event.latLng;
});
See https://developers.google.com/maps/documentation/javascript/events#EventArguments
Not sure what is going on here, but I want it to make an additional circle every second as the device moves. All it does is make 1 circle. I want the circles to highlight the route I have taken. Recommendations? Thanks
LocationManager locationmanager = (LocationManager) getSystemService(LOCATION_SERVICE);
Criteria cr = new Criteria();
String provider = locationmanager.getBestProvider(cr, true);
Location location = locationmanager.getLastKnownLocation(provider);
locationmanager.requestLocationUpdates(provider, 1000, 0, (LocationListener) this);
CircleOptions circleOptions = new CircleOptions()
.center(new LatLng(location.getLatitude(), location.getLongitude()));
circleOptions.radius(3.048); // In meters
mMap.addCircle(circleOptions);
Put:
CircleOptions circleOptions = new CircleOptions()
.center(new LatLng(location.getLatitude(), location.getLongitude()));
circleOptions.radius(3.048); // In meters
mMap.addCircle(circleOptions);
inside onLocationChanged(Location location) callback.
I'm working on a mobile app using jQuery Mobile. I also you the plugin "jquery-ui-map" to do my map (that helped alot with display issues using only GMap with jQM).
I'm able to add polyline on the map and it works just fine. But when I try to use the fitBounds method, it doesn't work. In fact, it zoom out alot. But not on my bounds.
Here is my code :
// Added some data, so you can understand the structure
// of variable "plan"
plan[0].lat_a = 45.4681; plan[0].lng_a = -73.7414;
plan[0].lat_b = 45.6797; plan[0].lng_b = -74.0386;
plan[1].lat_a = 45.6797; plan[1].lng_a = -74.0386;
plan[1].lat_b = 48.7753; plan[1].lng_b = -64.4786;
var polylinesCoords = new Array();
var bounds = new google.maps.LatLngBounds();
// Starting point
var LatLng = new google.maps.LatLng(plan[0].lat_a, plan[0].lng_a);
bounds.extend(LatLng);
// Building the polyline coords and bounds
for (var x=0; x<plan.length; x++) {
polylinesCoords.push(new google.maps.LatLng(plan[x].lat_a, plan[x].lng_a), new google.maps.LatLng(plan[x].lat_b, plan[x].lng_b));
LatLng = new google.maps.LatLng(plan[x].lat_b, plan[x].lng_b);
bounds.extend(LatLng);
}
// Drawing polyline on map
$('#map_canvas').gmap('addShape', 'Polyline', {
'path': polylinesCoords,
'strokeColor': '#c00',
'strokeThickness': 5
});
// «Focus» map on polyline with bounds
var map = $("#map_canvas").gmap("get", "map");
map.fitBounds(bounds);
Everything in this snippet seems to works fine, except for the very last line.
Any ideas ?
You might've missed to center the map to any of your pin. I got your code working with this line of code
$('#map_canvas').gmap('option', 'center', (new google.maps.LatLng(plan[0].lat_a,plan[0].lng_a)));
I'm trying to do an overlay on Google Maps. I have generated tiles of my image using maptiler, but the example generated by maptiler is in v2 and i want to use v3. The example generated by maptiler is also very complex and does some unnecessary opacity stuff. Now v3 of GM has changed a lot since v2 and i have some problems to generate the LatLng of a certain point on the screen. getProjection() keeps being undefined, whatever i do, any idea how to get the projection?
<script>
var mapBounds = new google.maps.LatLngBounds();
var mapMinZoom = 8;
var mapMaxZoom = 14;
var overlay;
var maptiler = new google.maps.ImageMapType({
getTileUrl: function(coord, zoom) {
if ((zoom < mapMinZoom) || (zoom > mapMaxZoom)) {
return "none.png";
}
var ymax = 1 << zoom;
var y = ymax - coord.y -1;
var tileBounds = new google.maps.LatLngBounds(
overlay.getProjection().fromDivPixelToLatLng( new google.maps.Point( (coord.x)*256, (coord.y+1)*256 ) , zoom ),
overlay.getProjection().fromDivPixelToLatLng( new google.maps.Point( (coord.x+1)*256, (coord.y)*256 ) , zoom )
);
if (mapBounds.intersects(tileBounds)) {
return "" + zoom + "/" + coord.x + "/" + (Math.pow(2,zoom)-coord.y-1) + ".png";
} else {
return "none.png";
}
},
tileSize: new google.maps.Size(256, 256),
isPng: true
});
var map;
function initialize() {
map = new google.maps.Map(document.getElementById("map_canvas"));
map.setZoom(11);
map.setMapTypeId('satellite');
mapBounds.extend(new google.maps.LatLng(50.9388615939, 3.80480816501));
mapBounds.extend(new google.maps.LatLng(51.4402541425, 4.73612507791));
map.fitBounds(mapBounds);
overlay = new google.maps.OverlayView();
overlay.draw = function() {};
overlay.setMap(map);
map.overlayMapTypes.insertAt(0, maptiler);
}
</script>
the overlay part is a hack i found on the internet which supposed to get you to the projection. unfortunately it didn't work. Any idea's how to fix this? in V2 you could do something like this:
var mercator = new GMercatorProjection()
mercator.fromPixelToLatLng( new GPoint( (tile.x)*256, (tile.y+1)*256 ) , zoom )
But this isn't possible anymore in v3.
Anyone that can help?
The example generated by maptiler can be found here:
http://gmapsexample.staging1.kunstmaan.be/googlemapsv2.html
This is a simple example in v3 which works:
http://gmapsexample.staging1.kunstmaan.be/googlemapsv3_simple.html
but i want everything except the map to be a specific color, so this is the example i'm trying to get working:
http://gmapsexample.staging1.kunstmaan.be/googlemapsv3.html
thanks,
Daan
You do not need to worry about getting or setting the projection if you are using MapTiler
These two YouTube videos will walk you through (among other things) using MapTiler with Google Maps API v3 map styled to be a certain color which is (if I understand correctly) exactly what you're asking about:
http://www.youtube.com/watch?v=CeSFUSZLeao
http://www.youtube.com/watch?v=WqSOLca2xOc
Try this as your Mercator function:
function GMercatorProjection() {
this.pixelOrigin_ = new google.maps.Point(tileSize / 2, tileSize / 2);
this.pixelsPerLonDegree_ = tileSize / 360;
this.pixelsPerLonRadian_ = tileSize / (2 * Math.PI)
}
Check the documentation about custom overlays in API3
https://code.google.com/apis/maps/documentation/javascript/overlays.html#CustomOverlays
I have the following code which lets the user plot two points on a Google MAP. I then want to be able to catch the event for each point(marker) being dragged to a new location. I am bad at Javascript and have spent hours trying to do this so I think it's time I get some help..
What I am trying to do is get the user to plot two points(markers) draggable on the map. I then want to be able to have my script write the positions(lat,long) to the document. I will then calculate the distance between these as part of a shipping app I am making.
I would like to have the contents of the document (lat,long) updated when a marker(point) is dragged to a new location.
Also, I fixed a schoolboy error where the point vars were being decalred inside the switch statement. My problem is fixed by moving the Add event listener statements inside the switch statement. Thanks Cannonade :)
The next thing now is to try and calculate the distance (crow flies) between the two points
Again, thanks for you help.. appreciated as always!!
Updated Code that works:
var map = null;
var geocoder = null;
var zoom = 15;
var first_point = false;
var boundary = new Array();
var cCount = 0;
var point1;
var point2;
function initialize() {
if (GBrowserIsCompatible()) {
first_point = false;
map = new GMap2(document.getElementById("map_canvas"));
var center = new GLatLng(37.4419, -122.1419);
map.setCenter(center, zoom);
GEvent.addListener(map, "click", function(overlay,point)
{
if (overlay != null)
{}
else
{
var n = boundary.length;
switch (cCount)
{
case 0:
point1 = new GMarker(point,{draggable: true});
map.addOverlay(point1);
cCount++;
GEvent.addListener(point1, "dragend", function()
{
alert('P1 Dragged');
});
break;
case 1:
point2 = new GMarker(point,{draggable: true});
map.addOverlay(point2);
cCount++;
GEvent.addListener(point2, "dragend", function()
{
alert('P2 Dragged');
});
break;
case 2:
map.clearOverlays();
cCount=0;
break;
}
}
});
map.addControl(new GSmallMapControl());
geocoder = new GClientGeocoder();
}
}
I have taken your code and made the following fixes:
Fixed the unbalanced brackets I mentioned in the comment.
Moved the two addListener calls into the switch statement so that the point1 and point2 variables are still in scope when you attach the events.
You can check out the example here (source).
Edit:
Here is some Javascript code to get the linear distance between two points (in meters):
/* Convert degress to radians */
function deg2rad(deg) {
return deg / (180 / Math.PI);
}
/* Calculate distance between two points */
function point_distance(a, b) {
var r = 6378700;
var lat1 = a.y;
var lat2 = b.y;
var lon1 = a.x;
var lon2 = b.x;
var dist = r * Math.acos(Math.sin(deg2rad(lat1)) * Math.sin(deg2rad(lat2)) +
Math.cos(deg2rad(lat1)) * Math.cos(deg2rad(lat2)) *
Math.cos(deg2rad(lon1 - lon2)));
return dist;
}
This is based on the approximate radius of the earth being 6378700m.