So in the mobile app I’m working on we want to give the user the possibility to reposition his business’ location on the map. The way we want this to work, visually, is present the user with a map he can drag to set the wanted location in the center of the map view. There’s an image on top of the map to indicate its center. This is what the UI looks like:
When the view to edit the location (the image above) is loaded, I want the map to pan and zoom to the current location. However, I cannot get this to work – the map always seems to zoom to the 0,0 coordinates. This is how I’m trying to achieve this:
...
Map {
id: map
anchors.fill: parent
wrapAroundEnabled: true
rotationByPinchingEnabled: true
zoomByPinchingEnabled: true
ArcGISTiledMapServiceLayer {
url: app.info.propertyValue( "urlTilesStreetMap", "" )
}
Image {
anchors.centerIn: parent
width: 50 * AppFramework.displayScaleFactor
height: 50 * AppFramework.displayScaleFactor
fillMode: Image.PreserveAspectCrop
source: "../assets/markers/default.png"
}
}
...
if( visible && root.feature ){
var obj = ArcGISRuntime.createObject( "Feature" );
obj.json = root.feature;
map.zoomTo( obj.geometry );
}
...
Note that root.feature
is a JSON object like this:
JSON.stringify( obj.json, null, 6 )
// output:
{
"attributes": {
"GlobalID": "{45AC36D8-3FDA-4753-9ECF-0CBA318F98A2}",
"OBJECTID": 32368,
...
},
"geometry": {
"spatialReference": {
"wkid": 4326
},
"x": 14.48243610000003,
"y": 35.90565804800008
}
}
How can I zoom the map to the location of root.feature
?
And extra question: how can I get the x and y of the center of the map to save as the new location?
Thanks in advance.
Solved! Go to Solution.
I am little confused here. Are you trying to zoom to the current location of the device or you are trying to zoom to the location of root.feature.
For latter, use the following code
// My json text looks like this, but you may already have a JSON object
jsonTxt.text = "{\"spatialReference\":{\"latestWkid\":102100,\"wkid\":102100}, \"x\": 9000000, \"y\": 6000000 }"
var g = ArcGISRuntime.createObject("Point", {"json":JSON.parse(jsonTxt.text)});
addSampleGraphic(pointGraphic,g)
function addSampleGraphic(graphic, geometry) {
if(geometry.spatialReference.wkid !== map.spatialReference.wkid)
{
var newGeom = geometry.project(map.spatialReference)
geometry = newGeom
console.log("reprojected geometry")
}
var graphicClone = graphic.clone();
graphicClone.geometry = geometry;
graphicsLayer.addGraphic(graphicClone);
map.zoomToResolution(20000)
map.panTo(geometry)
}
I hope this helps. If you are looking to zoom to your current location use Map::PositionDisplay.positionSource to get the current location.
Getting the center of the map is quite straightforward. Use Map.extent.center, this should return you a point geometry.
Thanks,
Nakul
I am little confused here. Are you trying to zoom to the current location of the device or you are trying to zoom to the location of root.feature.
For latter, use the following code
// My json text looks like this, but you may already have a JSON object
jsonTxt.text = "{\"spatialReference\":{\"latestWkid\":102100,\"wkid\":102100}, \"x\": 9000000, \"y\": 6000000 }"
var g = ArcGISRuntime.createObject("Point", {"json":JSON.parse(jsonTxt.text)});
addSampleGraphic(pointGraphic,g)
function addSampleGraphic(graphic, geometry) {
if(geometry.spatialReference.wkid !== map.spatialReference.wkid)
{
var newGeom = geometry.project(map.spatialReference)
geometry = newGeom
console.log("reprojected geometry")
}
var graphicClone = graphic.clone();
graphicClone.geometry = geometry;
graphicsLayer.addGraphic(graphicClone);
map.zoomToResolution(20000)
map.panTo(geometry)
}
I hope this helps. If you are looking to zoom to your current location use Map::PositionDisplay.positionSource to get the current location.
Getting the center of the map is quite straightforward. Use Map.extent.center, this should return you a point geometry.
Thanks,
Nakul
Thanks a lot, Nakul! Your sample code helped a lot -- geometry.project() was exactly what I needed.