Delegate for different graphical objects in MapItemView



  • I want to write an application which shows different graphical objects on an map. I want to use MapItemView. The data for my application is in a model. It can contain circle , polygones or other graphical objects. I don't know how I can write a delegate for different graphical objects. It work's fine for example for circles. In this case I use the MapCircleClass.


  • Moderators

    Hi @Thomas-W ,
    Personally I haven't tried QtLocations myself but looking at the documentation it seems that it somewhat similar to ListView in terms of functionality for eg. it uses model, delegete etc..
    In case of ListVIew we could assign multiple delegates by for eg. assigning it a Component containing a Loader which loads different Items. Something like this:
    http://doc.qt.io/qt-5/qml-qtquick-loader.html#using-a-loader-within-a-view-delegate

    Inside the Loader you can include a condition so that one particular Item will be loaded as required.



  • Hi p3Co, I have tried your hint. Below is the source code of a simple example, but it doesn't work. Any ideas?

    MyModel.qml

    import QtQuick 2.0
    ListModel {
         id: elementModel
         ListElement {
             type: "circle"
             refLong: 51.23
             refLat:  7.9
         }
         ListElement {
             type: "polygon"
             refLong: 52.23
             refLat:   8.0
         }
     }
    

    MultiDelagte.qml

    import QtQuick 2.0
    import QtPositioning 5.6
    import QtLocation 5.6
    
    Loader {
        id: multiDelegate
        anchors.fill: parent
        anchors.topMargin: 2
        sourceComponent: bestDelegate(type)
    
        function bestDelegate(t) {
            if (t === "circle")
                return circleDelegate
            return polygonDelegate // t == "string"
        }
    
        Component {
            id: circleDelegate
            MapCircle {
                radius: 5000
                color: "red"
                center {
                    latitude: refLat
                    longitude: refLong
                }
            }
        }
    
        Component {
            id: polygonDelegate
    
            MapPolygon {
                color: "green"
                path: [{
                        latitude: refLat,
                        longitude: refLong
                    }, {
                        latitude: refLat,
                        longitude: refLong
                    }, {
                        latitude: refLat,
                        longitude: refLong
                    }]
            }
        }
    }
    

    main.qml:

    import QtQuick 2.5
    import QtQuick.Controls 2.1
    import QtQuick.Controls.Material 2.1
    import QtPositioning 5.6
    import QtLocation 5.6
    
    
    
    ApplicationWindow {
        id: appWindow
        visible: true
        width: 640
        height: 480
        title: qsTr("Air Companion")
    
        property variant centerCoordinate: QtPositioning.coordinate(51.3666667, 7.7)
    
            //! [centercoordinate]
            Plugin {
                id: myPlugin
                name: "osm"
            }
    
        Map
        {
            id:myMap
            plugin: myPlugin
            center: centerCoordinate
            zoomLevel: 15
            anchors.fill:parent
            MapItemView {
                  id: dataView
                  model: MyModel{}
                  delegate: MultiDelegate{}
                }
        }
    }
    

  • Moderators

    @Thomas-W Are you getting any errors ?
    Instead of Loader as root element inside the MultiDelagteq.ml use Component and then use Loader inside it to load the required componenets.



  • @p3c0 I'm getting no errors. I have tried to use Component as the root element. But it doesn't work, no circle or polygon was shown on the map. I have tried nearly the same example with a ListView. In this case it worked well.

    Has anyone a working sample?



  • if (t === "circle")

    one = too much?


  • Moderators

    @Thomas-W. Unfortunately I too haven't worked with Maps but did you debugging the code to find out at what point it fails? That would be more useful.


  • Moderators

    @VRonin said in Delegate for different graphical objects in MapItemView:

    if (t === "circle")

    one = too much?

    This is Ok in Javascript.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.