topic Re: Add image overlay to feature in Qt Maps SDK Questions

Add image overlay to feature

MKa — Fri, 10 Dec 2021 22:49:13 GMT

I have a mapview that shows one feature on it. I have an image that i have a URL for, that I want to overlay on that feature. The image has a rectangle bounds that I also know. I can't figure out how to get this image to overlay on the feature. I have tried the Graphics overlay, but cant find the correct symbol class that will take my image url. Below here the PicutreMarkerSymbol will take my URL. Again, I know the bounds of the image, as the image was actually created from the shape of my feature in another program.

This doesn't work obviously, but what can i do to overlay my image on my feature

GraphicsOverlay {
        id: graphicsOverlay
        Graphic {
            geometry: feature.geometry

            PictureMarkerSymbol {
                url: "https://urltoMyImage"
                width: 32
                height: 32
                offsetY: 16
            }
        }
    }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Add image overlay to feature

LucasDanzinger — Tue, 01 Oct 2019 17:56:48 GMT

Is your feature a Polygon? If so, PictureFillSymbol might be your solution - PictureFillSymbol QML Type | ArcGIS for Developers

Re: Add image overlay to feature

MKa — Fri, 10 Dec 2021 22:49:15 GMT

This option is slightly better, and I use the coordinates that came with the image to create the envelope that the picture fits in. But how do i then redraw the image when I zoom in?

Initial Load looks good

Zooming in seems to retain the same envelope, how do I redraw the envelope?

GraphicsOverlay {
        id: graphicsOverlay
        Graphic {
            Envelope {
                id: envelopeCHI
                xMax: -82.2186596479493
                yMin: 42.3568647873956
                xMin: -82.2062302246723
                yMax: 42.3641136441737
                spatialReference: SpatialReference.createWgs84()
            }

            PictureFillSymbol  {
                url: "https://urltoMyImage"
            }
        }
    }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Add image overlay to feature

LucasDanzinger — Tue, 01 Oct 2019 21:02:22 GMT

Perhaps you can try out a KML Ground Overlay. This allows you to take an image and display it at a specified location - Here is an example in our develop branch (100.7), but the same code will work for 100.6 arcgis-runtime-samples-qt/ArcGISRuntimeSDKQt_QMLSamples/EditData/EditKmlGroundOverlay at v.next · Esri/arcgis-runtime-sa…

In the example, a historic photo jpg is overlaid on a location at a specified envelope, and it continues to draw correctly as you zoom

Re: Add image overlay to feature

MKa — Fri, 10 Dec 2021 22:49:18 GMT

I can get the KMLDataset to show up when using the sample from your link

KmlDataset {
            url: "https://www.arcgis.com/sharing/rest/content/items/600748d4464442288f6db8a4ba27dc95/data"
}‍‍‍‍‍‍

but when I try and use the KML Icon I can never get my Image to show? I don't know what I am missing here

KmlLayer {
        id: kmlLayer
        description: "description"
        layerId: "layerId"
        name: "Detail Name"
        // Create a KML Dataset
        KmlDataset {
            //url: "https://www.arcgis.com/sharing/rest/content/items/600748d4464442288f6db8a4ba27dc95/data"

            // Create a Ground Overlay by assigning an icon and geometry
            KmlGroundOverlay {
                id: groundOverlay
                
                KmlIcon {
                    url: "https://myURL"
                }
                Envelope {
                    id: envelopeCHI
                    xMax: -82.2186596479493
                    yMin: 42.3568647873956
                    xMin: -82.2062302246723
                    yMax: 42.3641136441737
                    spatialReference: SpatialReference.createWgs84()
                }
            }
        }
    }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

myMapView.map.operationalLayers.append(kmlLayer)‍

Re: Add image overlay to feature

LucasDanzinger — Fri, 10 Dec 2021 22:49:20 GMT

Are you pointing the KmlIcon URL to a valid image? I tried pointing it to the below online URL and it worked well:

SceneView {
    id: sceneView
    anchors.fill: parent

    Scene {
        BasemapImagery {}

        // Create a KML Layer
        KmlLayer {
            id: kmlLayer
            // Create a KML Dataset
            KmlDataset {
                // Create a Ground Overlay by assigning an icon and geometry
                KmlGroundOverlay {
                    id: groundOverlay
                    rotation: -3.046024799346924

                    KmlIcon {
                        url: "https://upload.wikimedia.org/wikipedia/commons/thumb/0/0b/Qt_logo_2016.svg/1200px-Qt_logo_2016.svg.png"
                    }

                    Envelope {
                        id: env
                        xMin: -123.066227926904
                        yMin: 44.04736963555683
                        xMax: -123.0796942287304
                        yMax: 44.03878298600624
                        SpatialReference {
                            wkid: 4326
                        }
                    }
                }
            }

            // set viewpoint to the ground overlay
            onLoadStatusChanged: {
                if (loadStatus !== Enums.LoadStatusLoaded)
                    return;

                const camera = ArcGISRuntimeEnvironment.createObject("Camera", {
                                                                         location: env.center,
                                                                         distance: 1250,
                                                                         heading: 45,
                                                                         pitch: 60,
                                                                         roll: 0
                                                                     });

                sceneView.setViewpointCamera(camera);
            }
        }
    }
}‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Add image overlay to feature

MKa — Sun, 12 Dec 2021 15:59:31 GMT

I am. I am actually using the sample url now

https://libapps.s3.amazonaws.com/accounts/55937/images/1944.jpg

I need this overlay to be on a mapview and not on a scene though? Is this the problem? The KML dataset worked on mapview, but does the kmlgroundoverlay not work on the mapview?

Re: Add image overlay to feature

LucasDanzinger — Fri, 10 Dec 2021 22:49:23 GMT

I changed the sample out from sceneview to mapview and that worked. It should work 2d and 3d.

MapView {
    id: sceneView
    anchors.fill: parent

    Map {
        BasemapImagery {}

        // Create a KML Layer
        KmlLayer {
            id: kmlLayer
            // Create a KML Dataset
            KmlDataset {
                // Create a Ground Overlay by assigning an icon and geometry
                KmlGroundOverlay {
                    id: groundOverlay
                    rotation: -3.046024799346924

                    KmlIcon {
                        url: "https://upload.wikimedia.org/wikipedia/commons/thumb/0/0b/Qt_logo_2016.svg/1200px-Qt_logo_2016.svg.png"
                    }

                    Envelope {
                        id: env
                        xMin: -123.066227926904
                        yMin: 44.04736963555683
                        xMax: -123.0796942287304
                        yMax: 44.03878298600624
                        SpatialReference {
                            wkid: 4326
                        }
                    }
                }
            }

            // set viewpoint to the ground overlay
            onLoadStatusChanged: {
                if (loadStatus !== Enums.LoadStatusLoaded)
                    return;

                const vp = ArcGISRuntimeEnvironment.createObject("ViewpointCenter", {
                                                                     center: env.center,
                                                                     targetScale: 10000
                                                                 });
                sceneView.setViewpoint(vp);
            }
        }
    }
}‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Add image overlay to feature

MKa — Wed, 02 Oct 2019 19:41:21 GMT

What are your imports settings at the top of your file? I can't get your code to work. It shows nothing for me? Does this have to be in 100.7?

Re: Add image overlay to feature

MKa — Thu, 03 Oct 2019 13:31:26 GMT

Lucas, thank you for all of your help. I figured it out. I couldn't understand why the sample KML overlay worked, but not in my application. I looked at everything including the ArcGIS Runtime License set in appinfo.json. It turns out that the sample didn't have this set, well on the development machine, you don't need a license. I had my license on my app set to runtimelite, as that is all i have ever needed to deploy. I set the license to nothing and I got the overlay to work. I then set it to the runtimeadvanced and it also worked. Thank you for taking the time to look into this for me and I hope this helps someone else that cant understand why the sample works and their own app does not.