Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

QML append new elements to pathElements (a list) in ShapePath



  • Hello,

    I'm trying to connect several points on a map with a spline (Catmull-Rom Splines using PathCurve in a ShapePath element) instead of simple straight lines.

    Unfortunately I can't figure out, how to dynamically fill the pathElements list with new PathCurves from a mouseclick, since pathElements doesn't support an append method.

    I also use a model to track my markers through markerModel, so it would be ideal, if I could use a similiar model which tracks the x and y mouse coordinates for the splines, but the underlying class QQuickPathCatmullRomCurve is private contrary to the QGeoCoordinate which I use in the markerModel to track the palced marker on the map.

    Any help would be appreciated!

    Here is the minimal qml code I'm currently using with hardcoded PathCurve for testing:

    import QtQuick 2.0
    import QtLocation 5.6
    import QtPositioning 5.6
    import QtQuick.Shapes 1.0
    
    Item {
    	visible: true
    	id: mainWindow
    
    	Map { //our map
    		id: myMap
    		anchors.fill: parent
    		plugin: mapPlugin
    		center: QtPositioning.coordinate(0.00, 0.00)
    		focus: true
    
    		Plugin {
    			id: mapPlugin
    			name: "osm" //openstreetmaps
    		}
    
    		MapItemView {
    			model: markerModel
    			delegate: mapcomponent
    		}
    
    		Component { //Placed marker
    			id: mapcomponent
    			MapQuickItem{
    				id: marker
    				coordinate: geoRole
    				sourceItem: Image{
    					id: markerimage
    					source: "qrc:/marker.png"
    				}
    			}
    		}
    
    		MapPolyline{ //Line between markers
    			id: myPath
    			antialiasing: true
    			line.color: "darkBlue"
    			line.width: 3
    			path: markerModel.path
    		}
    
    		MapQuickItem {
    			coordinate: QtPositioning.coordinate(0.00, 0.00)
    
    			sourceItem: Shape {
    				id: myShape
    				anchors.fill: parent
    
    				ShapePath {
    					objectName: "myPath"
    					strokeColor: "black"
    					strokeWidth: 2
    					capStyle: ShapePath.RoundCap
    
    					id: myShapePath
    
    					fillColor: "transparent"
    
    					startX: 0; startY: 0
    					pathElements: [
    						PathCurve{
    							x: 150
    							y: 150
    						},
    						PathCurve{
    							x: 150
    							y: 200
    						},
    						PathCurve{
    							x: 50
    							y: 50
    						}
    					]
    				}
    			}
    			zoomLevel: 15
    		}
    
    		MouseArea {
    			anchors.fill: parent
    
    			onClicked: {
    				var coord = parent.toCoordinate(Qt.point(mouse.x,mouse.y))
    				markerModel.addMarker(coord)
    			}
    		}
    	}
    }
    
    

Log in to reply