Discussion :

[jennif56l]

bonjour

J'essaie d'ajouter plusieurs lignes distinctes sur la carte openstreetmap en QML a partir d'un Json qui contient différent type (point et linestring.
J'arrive a placer les points sur la carte avec un MapQuickItem et j'aimerais faire de même avec les lignes mais elles apparaissent liés les uns aux autres

Voici ma tentative :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
import QtQuick
import QtQuick.Dialogs
import QtQuick.Controls
import QtPositioning
import QtLocation
import QtCore
import QtQuick.Controls.Basic
 
Rectangle {
    anchors.fill: parent
    Plugin {
        id: mapPlugin
        name: "osm"
    }
 
    Map {
            id: map
            anchors.fill: parent
            plugin: mapPlugin
            center: QtPositioning.coordinate(59.441706425544,19.50356807068)
            zoomLevel: 5
 
            property geoCoordinate startCentroid
 
            WheelHandler {    // zoom molette
                id: wheel
                rotationScale: 1/100
                property: "zoomLevel"
            }
            DragHandler {
                id: drag
                target: null
                onTranslationChanged: (delta) => map.pan(-delta.x, -delta.y)
            }
 
            MapItemView
            {
                model: pl
                MapPolyline{
                        id:pl
                        line.color: "blue"
                        width: 2
                        visible: true
                        path: pl
 
                }
            }
            Component.onCompleted: {
                var JsonString = '{"features":[{"geometry":{"coordinates":[19.50356807068,59.441706425544],"type":"Point"},"properties":{"color":"Red","name":"Svenska Högarna"},"type":"Feature"},{"geometry":{"coordinates":[18.474967922139,57.474603476726],"type":"Point"},"properties":{"color":"Red","name":"Gotland Island"},"type":"Feature"},{"geometry":{"coordinates":[[23.958410829456,61.156042630065],[23.040209031792,61.150377804625]],"type":"LineString"},"type":"Feature"},{"geometry":{"coordinates":[[24.958410829456,60.156042630065],[25.040209031792,60.150377804625]],"type":"LineString"},"type":"Feature"},{"geometry":{"coordinates":[24.958410829456,60.156042630065],"type":"Point"},"properties":{"color":"Red","name":""},"type":"Feature"},{"geometry":{"coordinates":[25.040209031792,60.150377804625],"type":"Point"},"properties":{"color":"Green","name":""},"type":"Feature"},{"geometry":{"coordinates":[[24.9945,60.1518],[23.1585,59.1111],[21.1988,59.5741],[20.0335,59.8579],[19.4794,59.4686],[18.1034,58.4287],[17.89,57.3109],[17.789,56.5184],[18.6508,56.8946],[20.2978,57.6451],[21.3818,58.618],[21.9284,59.0893],[22.9255,59.2777],[24.2345,59.5249],[24.9983,60.1533]],"type":"LineString"},"properties":{"color":"white"},"type":"Feature"}],"type":"FeatureCollection"}'
                var data = JSON.parse(JsonString);
                var list = data["features"];
                var pathliste = []
                for (var i in list)
                {
                    if (list[i]["geometry"]["type"]==="LineString")
                    {
 
                        for(var j in list[i]["geometry"]["coordinates"])
                        {
                            pathliste.push(
                                        {
                                            latitude:list[i]["geometry"]["coordinates"][j][1],
                                            longitude:list[i]["geometry"]["coordinates"][j][0]
                                        })
                        }
                        console.log(pathliste[0].latitude)
 
                    }
 
                }
            pl.path = pathliste
 
            }
 
        }
}

pourriez vous me donner quelques explications je ne suis pas très a l'aise avec le QML merci d'avance

[dourouc05]

Je ne connais pas le module QtLocation, d'où ma supposition : peut-être dois-tu avoir plusieurs items MapItemView, un par ligne ? Tu peux utiliser un ListModel pour les générer à partir d'un modèle.

[jennif56l]

merci pour ta réponse

j'essaie avec ce que tu m'as proposé mais je n'arrive a rien il y a sans doute quelque chose qui je n'ai pas compris

voila ce que j'ai fait

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
import QtQuick
import QtQuick.Dialogs
import QtQuick.Controls
import QtPositioning
import QtLocation
import QtCore
import QtQuick.Controls.Basic
 
Rectangle {
    anchors.fill: parent
    Plugin {
        id: mapPlugin
        name: "osm"
    }
 
 
 
    Map {
            id: map
            anchors.fill: parent
            plugin: mapPlugin
            center: QtPositioning.coordinate(59.441706425544,19.50356807068)
            zoomLevel: 5
 
            property geoCoordinate startCentroid
 
            WheelHandler {    // zoom molette
                id: wheel
                rotationScale: 1/100
                property: "zoomLevel"
            }
            DragHandler {
                id: drag
                target: null
                onTranslationChanged: (delta) => map.pan(-delta.x, -delta.y)
            }
 
            MapItemView
            {
                ListModel{
                    id: polyligneModel
 
                }
                model: polyligneModel
                delegate : MapPolyline{
 
                    line.color: "blue"
                    width: 2
                    visible: true
                    path: polyligneModel.path
 
                }
                Component.onCompleted: {
                    var JsonString = '{"features":[{"geometry":{"coordinates":[19.50356807068,59.441706425544],"type":"Point"},"properties":{"color":"Red","name":"Svenska Högarna"},"type":"Feature"},{"geometry":{"coordinates":[18.474967922139,57.474603476726],"type":"Point"},"properties":{"color":"Red","name":"Gotland Island"},"type":"Feature"},{"geometry":{"coordinates":[[23.958410829456,61.156042630065],[23.040209031792,61.150377804625]],"type":"LineString"},"type":"Feature"},{"geometry":{"coordinates":[[24.958410829456,60.156042630065],[25.040209031792,60.150377804625]],"type":"LineString"},"type":"Feature"},{"geometry":{"coordinates":[24.958410829456,60.156042630065],"type":"Point"},"properties":{"color":"Red","name":""},"type":"Feature"},{"geometry":{"coordinates":[25.040209031792,60.150377804625],"type":"Point"},"properties":{"color":"Green","name":""},"type":"Feature"},{"geometry":{"coordinates":[[24.9945,60.1518],[23.1585,59.1111],[21.1988,59.5741],[20.0335,59.8579],[19.4794,59.4686],[18.1034,58.4287],[17.89,57.3109],[17.789,56.5184],[18.6508,56.8946],[20.2978,57.6451],[21.3818,58.618],[21.9284,59.0893],[22.9255,59.2777],[24.2345,59.5249],[24.9983,60.1533]],"type":"LineString"},"properties":{"color":"white"},"type":"Feature"}],"type":"FeatureCollection"}'
                    var data = JSON.parse(JsonString);
                    var list = data["features"];
                    for (var i in list)
                    {
                        if (list[i]["geometry"]["type"]==="LineString")
                        {
                            var polyCoords = []
                            for(var j in list[i]["geometry"]["coordinates"])
                            {
                                polyCoords.push(
                                            {
                                                latitude:list[i]["geometry"]["coordinates"][j][1],
                                                longitude:list[i]["geometry"]["coordinates"][j][0]
                                            })
                                console.log(polyCoords[j].latitude,",",polyCoords[j].longitude)
 
                            }
                            var newLine = {"path" : polyCoords}
                            polyligneModel.append(newLine)
                        }
 
                    }
 
                }
            }
 
 
        }
}

j'obtiens l'erreur suivante : qrc:/testqml.qml:59:21: Unable to assign QQmlListModel to QList<QGeoCoordinate>

[dourouc05]

À quelle ligne dans le code que tu postes correspond la 59 du message d'erreur ? Ça ne semble pas coller .