Show callout

Loading

Code

import QtQuick 2.6
import Esri.ArcGISExtras 1.1
import Esri.ArcGISRuntime 100.2
import Esri.ArcGISRuntime.Toolkit.Controls 100.2

Rectangle {
    clip: true

    width: 800
    height: 600

    property real scaleFactor: System.displayScaleFactor
    property Point calloutLocation
    property real xCoor
    property real yCoor

    // Map view UI presentation at top
    MapView {
        id: mapView
        anchors.fill: parent
        clip: true

        Map {
            BasemapTopographic {}

            // initial Viewpoint
            ViewpointCenter {
                Point {
                    x: -1.2e7
                    y: 5e6
                    spatialReference: SpatialReference { wkid: 3857 }
                }
                targetScale: 1e7
            }
        }

        // initialize Callout
        calloutData {
            imageUrl: "qrc:/Samples/DisplayInformation/ShowCallout/RedShinyPin.png"
            title: "Location"
            location: calloutLocation
            detail: "x: " + xCoor + " y: " + yCoor
        }

        Callout {
            id: callout
            calloutData: parent.calloutData
        }

        // display callout on mouseClicked
        onMouseClicked: {
            if (callout.calloutVisible)
                callout.dismiss()
            else
            {
                calloutLocation = mouse.mapPoint;
                xCoor = mouse.mapPoint.x.toFixed(2);
                yCoor = mouse.mapPoint.y.toFixed(2);
                callout.accessoryButtonHidden = true;
                callout.showCallout();
            }
        }
    }

    // Neatline rectangle
    Rectangle {
        anchors.fill: parent
        color: "transparent"
        border {
            width: 0.5 * scaleFactor
            color: "black"
        }
    }
}


In this topic
  1. Code