I have two questions which are somehow related.
How do I erase the generated route with red, and have the original map (without the red route) I have tried many function on the map item but non of them worked. For example I have tried the code below but the red route remains.
function clearMapDataForSession()
{
mapview.clearData();
routeModel.update()
}
You can get a list of coordinates from the Route
by using the properties path or segments. The path
property directly gives you a list of coordinates
on the given Route
, the segments
property on the other hand gives you a list of RouteSegments which in turn contain a list of coordinates
given by its path
property.
Print the list of Route
coordinates via segments
:
var segments = routeModel.get(0).segments
for (var i = 0; i < segments.length; i++) {
var path = segments[i].path
for (var j = 0; j < path.length; j++)
console.log(path[j])
}
Print the list of Route
coordinates via path
:
var path = routeModel.get(0).path
for (var i = 0; i < path.length; i++) {
console.log(path[i])
}
If you compare the list of coordinates given by the two options, they are the same. The benefit of RouteSegments
is that you get the distance
of the segment as a property. So if you want to generate a list of coordinates/points on the Route
at the same distance, this would help you in writing some sort of an algorithm.
In order to erase a generated Route
you need to call reset()
on the RouteModel
. If you want to also clear the waypoints of a RouteQuery
you should call clearWaypoints()
as well.
import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import QtLocation 5.15
import QtPositioning 5.15
ApplicationWindow {
id: window
width: 800
height: 600
visible: true
title: qsTr("Map")
header: ToolBar {
RowLayout {
anchors.fill: parent
ToolButton {
text: qsTr("Reset")
onClicked: {
routeQuery.clearWaypoints()
routeModel.reset()
}
}
}
}
Plugin {
id: mapPlugin
name: "osm"
}
RouteQuery {
id: routeQuery
}
RouteModel {
id: routeModel
plugin: mapPlugin
query: routeQuery
autoUpdate: false
}
Map {
id: map
anchors.fill: parent
plugin: mapPlugin
center: QtPositioning.coordinate(59.91, 10.75) // Oslo
zoomLevel: 14
MapItemView {
model: routeModel
delegate: MapRoute {
route: routeData
line.color: "blue"
line.width: 5
smooth: true
opacity: 0.8
}
}
MapItemView {
model: routeModel.status == RouteModel.Ready ? routeModel.get(0).path : null
delegate: MapQuickItem {
anchorPoint.x: pathMarker.width / 2
anchorPoint.y: pathMarker.height / 2
coordinate: modelData
sourceItem: Rectangle {
id: pathMarker
width: 8
height: 8
radius: 8
border.width: 1
border.color: "black"
color: "yellow"
}
}
}
MapItemView {
model: routeQuery.waypoints
delegate: MapQuickItem {
anchorPoint.x: waypointMarker.width / 2
anchorPoint.y: waypointMarker.height / 2
coordinate: modelData
sourceItem: Rectangle {
id: waypointMarker
width: 10
height: 10
radius: 10
border.width: 1
border.color: "black"
color: "red"
}
}
}
MouseArea {
anchors.fill: parent
onClicked: {
routeQuery.addWaypoint(map.toCoordinate(Qt.point(mouse.x,mouse.y)))
routeModel.update()
}
}
}
}