Zoom to layer issue using appStudio QT

[EricAtkinson1]

Hi all,

I'm having issues with zoom to feature code. I am using the code in the sample "Listed Related features" but doesn't seem to work and the confusing part is that there are no errors displaying. 

mapView.setViewpointGeometryAndPadding(feature.geometry, 30);

Is this correct or does anyone know of another way I can zoom to feature while clicking on a feature on the map?

Thanks all 

[JaredCaccamo]

Hello @EricAtkinson1 , 

I don't see anything wrong with your line of code so that's good news. If I run the "List related features" QML sample with 100.9/100.10 it works perfectly fine for me and it also set's the viewpoint to the selected features geometry when clicked.

Could you provide a bit more context? Which version of ArcGIS Runtime are you using? Maybe provide the .qml file or a larger section of the code so I can take a closer look at the rest of your workflow.

Sincerely,

Jared

[EricAtkinson1]

Hi Jared,

Thanks for the reply. Im pretty new to this so am learning on the way so any help would be appreciated. I feel like I might be missing a connection as in the previous version it has connections (line110 on sample) but cant seem to get connections working with onIdentifyLayerStatusChanged.

Here is some of my code, the map url has been taken on purpose. The app works just cant seen to get the map to zoom once the feature has been clicked. 

Cheers, Eric

contentItem: Rectangle{

            anchors.top:header.bottom

            MapView {

                id: mapView

                anchors.fill: parent

                viewInsets.bottom: attributeView.height / scaleFactor

                locationDisplay {

                    positionSource: PositionSource {}

                }

                Map {

                    initUrl: "deleted on purpose"

                    onOperationalLayersChanged: {

                        for (var i = 0; operationalLayers.count; i++) {

                            if (operationalLayers.get(i).name === "ESCAD Incidents") {

                                featureLayer = operationalLayers.get(i)

                                featureLayer.refreshInterval = 5000

                                featureLayer.selectionColor = "#02253A"

                                //featureTable = featureLayer.featureTable

                                break

                            }

                        }

                    }

                }

                onMouseClicked: {

                    attributeView.height = 0;

                    featureLayer.clearSelection()

                    identifyLayer(featureLayer, mouse.x, mouse.y, 15, false)

                    relatedFeaturesModel.clear();

                }

                onIdentifyLayerStatusChanged: {

                    if (identifyLayerStatus === Enums.TaskStatusCompleted) {

                        if (identifyLayerResult.geoElements.length > 0) {

                            //Retrieve Feature

                            var feature = identifyLayerResult.geoElements [0]

                            //select feature

                            featureLayer.selectFeature(feature)

                            //Get information from layer 

                            var masterIncidentNumber = feature.attributes.attributeValue("master_Incident_Number")

                            var incidentType = feature.attributes.attributeValue("Incident_Type")

                            var MINDetails = feature.attributes.attributeValue("MIN_Details")

                            var CrossStreet = feature.attributes.attributeValue("Cross_Street")

                            var location = feature.attributes.attributeValue("location")

                            var commandChannel = feature.attributes.attributeValue("Command_Channel")

                            var tacChannel = feature.attributes.attributeValue("Primary_TAC_Channel")

                            var longitude = feature.attributes.attributeValue("longitude")

                            var latitude = feature.attributes.attributeValue("latitude")

                            console.log("masterIncidentNumber", masterIncidentNumber )

                            console.log("location", location)

                            console.log("Incident Type", incidentType)

                            console.log("MIN_ID", MINDetails)

                            console.log("Cross Street", CrossStreet)

                            console.log("Command_Channel", commandChannel)

                            console.log("Primary_TAC_Channel", tacChannel)

                            var listElement = {

                                "masterIncidentNumber" : masterIncidentNumber,

                                "location" : location,

                                "incidentType" : incidentType,

                                "MIN_ID" : MINDetails,

                                "crossStreet" : CrossStreet,

                                "Command_Channel" : commandChannel,

                                "Primary_TAC_Channel" : tacChannel,

                                "longitude" : longitude,

                                "latitude" : latitude

                            };

                            relatedFeaturesModel.append(listElement);

                            //zoom in not working

                           mapView.setViewpointGeometryAndPadding(feature.geometry, 30);

                        }

                        attributeView.height = 200 * scaleFactor

                    }

                }

                Rectangle {

                    id: attributeView

                    anchors {

                        left: parent.left

                        right: parent.right

                        bottom: parent.bottom

[JaredCaccamo]

Hey @EricAtkinson1 ,

Just to let you know that you can click on the insert code button so that it doesn't break it down into block by block. Will make for more readable code on geonet. Take a look at the picture below.

I don't see anything inherently wrong with your workflow to select a feature and zoom to it. I took your general workflow and tested it on some sample data and it works like it should. Which version of ArcGISRuntime are you targeting? Here is my code blow:

import QtQuick 2.6
import QtQuick.Controls 2.2
import Esri.ArcGISRuntime 100.10

ApplicationWindow {
    id: appWindow
    width: 800
    height: 600
    title: "SelectAFeature"

    property FeatureLayer alaskaNationalParks: null

    // add a mapView component
    MapView {
        id: mapView
        anchors.fill: parent
        // set focus to enable keyboard navigation
        focus: true

        // add a map to the mapview
        Map {
            id: map
            initUrl: "https://arcgis.com/home/item.html?id=dcc7466a91294c0ab8f7a094430ab437"

            onLoadStatusChanged: {
                if (loadStatus !== Enums.LoadStatusLoaded)
                    return;

                // get the Alaska National Parks feature layer
                map.operationalLayers.forEach(fl =>
                  {
                      if (fl.name.indexOf("- Alaska National Parks") !== -1) {
                          alaskaNationalParks = fl;
                          print("FL set");
                      }
                  });
            }
        }

        onMouseClicked: {
            alaskaNationalParks.clearSelection()
            identifyLayer(alaskaNationalParks, mouse.x, mouse.y, 15, false);
        }

        onIdentifyLayerStatusChanged: {
            if (error)
                print(error.message);
            if (identifyLayerStatus === Enums.TaskStatusCompleted) {
                if (identifyLayerResult.geoElements.length > 0) {
                    //Retrieve Feature
                    var feature = identifyLayerResult.geoElements[0];
                    //select feature
                    alaskaNationalParks.selectFeature(feature);
                    mapView.setViewpointGeometryAndPadding(feature.geometry, 30);
                }
            }
        }
    }
}

[EricAtkinson1]

Thanks for the tip... I'm running it in 100.8.... no errors come up just no auto zoom capability to the feature.

[EricAtkinson1]

Is there's maybe a Onmouseclicked or onclicked line of code I can use instead?

[JaredCaccamo]

Hello @EricAtkinson1 ,

I apologize for not responding sooner. I just checked the code with 100.8 and it successfully changes the extent of the mapview to that of the selected features. Might I suggest checking the extent of your feature? The code you are using is correct, my guess is that the features extent is not what you are expecting which is why there is no perceived zoom animation.

[EricAtkinson1]

Thanks I'll have a look. My confusion is that when I put the app into navigation mode it zooms to location or when I search for a feature it zooms to extent.... 

[EricAtkinson1]

Hi Jared,

Still having issues and its not an extent issue. I have similar code in my App (mapView.locationDisplay.autoPanMode = Enums.LocationDisplayAutoPanModeRecenter; ) and it zooms to location.

I have tired my featureLayer in the code below and also locationDisplay in the code below but it still doesn't work including no error messaged.

mapView.setViewpointGeometryAndPadding(feature.geometry, 30);

Any help would be appreciated.

Eric

[EricAtkinson1]

Hey guys, 

Still really stuck... I feel like this is a simple fix but i've been stuck on this. I've attached the code i'm using and I feel like I might not be connecting the setViewpointGeometryAndPadding correctly.

onIdentifyLayerStatusChanged: {
                    if (identifyLayerStatus === Enums.TaskStatusCompleted) {
                        if (identifyLayerResult.geoElements.length > 0) {
                            //Retrieve Feature
                            var feature = identifyLayerResult.geoElements [0]
                            //select feature
                            featureLayer.selectFeature(feature)
                            //Get information from layer ESCAD

                            var masterIncidentNumber = feature.attributes.attributeValue("master_Incident_Number")
                            var incidentType = feature.attributes.attributeValue("Incident_Type")
                            var MINDetails = feature.attributes.attributeValue("MIN_Details")
                            var CrossStreet = feature.attributes.attributeValue("Cross_Street")
                            var location = feature.attributes.attributeValue("location")
                            var commandChannel = feature.attributes.attributeValue("Command_Channel")
                            var tacChannel = feature.attributes.attributeValue("Primary_TAC_Channel")
                            var longitude = feature.attributes.attributeValue("longitude")
                            var latitude = feature.attributes.attributeValue("latitude")

                            console.log("masterIncidentNumber", masterIncidentNumber )
                            console.log("location", location)
                            console.log("Incident Type", incidentType)
                            console.log("MIN_ID", MINDetails)
                            console.log("Cross Street", CrossStreet)
                            console.log("Command_Channel", commandChannel)
                            console.log("Primary_TAC_Channel", tacChannel)
                            var listElement = {
                                "masterIncidentNumber" : masterIncidentNumber,
                                "location" : location,
                                "incidentType" : incidentType,
                                "MIN_ID" : MINDetails,
                                "crossStreet" : CrossStreet,
                                "Command_Channel" : commandChannel,
                                "Primary_TAC_Channel" : tacChannel,
                                "longitude" : longitude,
                                "latitude" : latitude
                            };
                            mapView.setViewpointGeometryAndPadding(feature.geometry,100);
                            attributeView.height = 200
                            relatedFeaturesModel.append(listElement);
                            //drawerMenu.height = 0
                            search.visible = false
                            callout.visible = false