IOS - converting geo coords

demo/index.html

@@ -19,6 +19,26 @@ <h1>Mapbox test</h1>
     <br/>
     <button onclick="showMap()">Show</button>
   </div>
+    <div id="deviceready" class="blink">
+        <p class="event listening">Connecting to Device</p>
+
+        <p class="event received">Device is Ready</p>
+
+        <div style="height:80px;position:absolute;bottom:0">
+            <button onclick="showMap()">Show</button>
+            <button onclick="addMarkers()">Markers</button>
+            <!--button onclick="addGeoJSON()">Add GeoJSON</button-->
+            <button onclick="addPolygon()">Poly</button>
+            <button onclick="getZoomLevel()">getZoom</button>
+            <button onclick="zoomIn()">+</button>
+            <button onclick="zoomOut()">-</button>
+            <button onclick="setCenter()">set center</button>
+            <button onclick="getCenter()">get center</button>
+            <button onclick="screen2Coords({'x': window.innerWidth/2,'y': window.innerHeight/2})">ctr2coords</button>
+            <button onclick="coords2Screen({'lat': 52.3732160,'lng': 4.8941680})">ctr2screen</button>
+            <button onclick="hideMap()">hide</button>
+        </div>
+    </div>
 </div>
 
 <div style="position:absolute; bottom:0; background-color: #eee">
@@ -209,6 +229,30 @@ <h1>Mapbox test</h1>
     )
   }
 
+
+    function coords2Screen(coords) {
+        Mapbox.convertCoordinate(coords,
+                function (point) {
+                    alert("x:"+point.x+" - y:"+point.y);
+                },
+                function (error) {
+                    alert(error)
+                })
+    }
+
+    function screen2Coords(point){
+        Mapbox.convertPoint({
+                    'x':point.x,
+                    'y':point.y
+                },
+                function (latlng) {
+                    alert("lat:"+latlng.lat+" - lng:"+latlng.lng);
+                },
+                function (error) {
+                    alert(error)
+                })
+    }
+
 </script>
 </body>
 </html>

src/ios/CDVMapbox.h

@@ -28,4 +28,7 @@
 - (void) getTilt:(CDVInvokedUrlCommand*)command;
 - (void) setTilt:(CDVInvokedUrlCommand*)command;
 
+- (void) convertCoordinate:(CDVInvokedUrlCommand*)command;
+- (void) convertPoint:(CDVInvokedUrlCommand*)command;
+
 @end

src/ios/CDVMapbox.m

@@ -242,6 +242,52 @@ - (void) putMarkersOnTheMap:(NSArray *)markers {
   }];
 }
 
+- (void) convertCoordinate:(CDVInvokedUrlCommand *)command {
+  NSDictionary *args = command.arguments[0];
+
+  double lat = [[args valueForKey:@"lat"]doubleValue];
+  double lng = [[args valueForKey:@"lng"]doubleValue];
+
+  if ((fabs(lat) > 90)||(fabs(lng) > 180)){
+    CDVPluginResult * pluginResult = [CDVPluginResult
+            resultWithStatus:CDVCommandStatus_ERROR
+             messageAsString:@"Incorrect Leaflet.LatLng value."];
+    [self.commandDelegate sendPluginResult:pluginResult callbackId:command.callbackId];
+  }
+
+  CGPoint screenPoint = [_mapView  convertCoordinate:CLLocationCoordinate2DMake(lat, lng)
+                                       toPointToView:_mapView];
+
+  NSDictionary *point = @{@"x" : @(screenPoint.x), @"y" : @(screenPoint.y)};
+
+  CDVPluginResult * pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK messageAsDictionary:point];
+
+  [self.commandDelegate sendPluginResult:pluginResult callbackId:command.callbackId];
+}
+
+- (void) convertPoint:(CDVInvokedUrlCommand *)command {
+  NSDictionary *args = command.arguments[0];
+
+  float x = [[args valueForKey:@"x"] floatValue];
+  float y = [[args valueForKey:@"y"] floatValue];
+
+  if ((x < 0 || y < 0)){
+    CDVPluginResult * pluginResult = [CDVPluginResult
+            resultWithStatus:CDVCommandStatus_ERROR
+             messageAsString:@"Incorrect Leaflet.Point point coordinates."];
+    [self.commandDelegate sendPluginResult:pluginResult callbackId:command.callbackId];
+  }
+
+  CLLocationCoordinate2D location = [_mapView convertPoint:CGPointMake(x, y)
+                                      toCoordinateFromView:_mapView];
+
+  NSDictionary *coordinates = @{@"lat" : @(location.latitude), @"lng" : @(location.longitude)};
+
+  CDVPluginResult * pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK messageAsDictionary:coordinates];
+
+  [self.commandDelegate sendPluginResult:pluginResult callbackId:command.callbackId];
+}
+
 #pragma mark - MGLMapViewDelegate
 
 // this method is invoked every time an annotation is clicked

www/Mapbox.js

@@ -51,5 +51,14 @@ module.exports = {
 
   addPolygon: function (options, successCallback, errorCallback) {
     cordova.exec(successCallback, errorCallback, "Mapbox", "addPolygon", [options]);
+  },
+
+  convertCoordinate: function(options, successCallback, errorCallback){
+    cordova.exec(successCallback, errorCallback, "Mapbox", "convertCoordinate", [options]);
+  },
+
+  convertPoint: function(options, successCallback, errorCallback){
+    cordova.exec(successCallback, errorCallback, "Mapbox", "convertPoint", [options]);
   }
+
 };