Uploaded image for project: 'Qt'
  1. Qt
  2. QTBUG-79489

Unable to change MapPolygon color and border.color after creation using MapboxGL plugin

    XMLWordPrintable

    Details

    • Platform/s:
      All
    • Commits:
      c1dd5c2979e1558427536fe2435ff3892afe3e6f (qt/qtlocation/5.13)

      Description

      When creating a MapPolygon on a Map using the MapboxGL plugin, the MapPolygon color, border.color and border.width cannot be changed by changing the property directly. It was found that by switching to Mapbox plugin, all property changes occur correctly.

      Running a sample program, and adding a property change to the border.width outputs an error "Unsupported property for managed Map item" which, strangely, then causes the MapPolygon to change it's color property to change as set.

      The sample code generates two MapPolygons with SequentialAnimations for each to change the properties. One has the addition of the border.width property change which causes the color property to change.

      import QtQuick 2.12
      import QtQuick.Window 2.13
      import QtLocation 5.12
      import QtPositioning 5.12
      
      Window {
          width: 512
          height: 512
          visible: true
      
          Plugin {
              id: mapPlugin
              name: "mapboxgl"
              PluginParameter { name: "mapboxgl.access_token"; value: "pk.eyJ1IjoibWFybG91Z3JvZW5ld2FsZCIsImEiOiJjamd2eDU4aXAwMmszMzNvNHZicG8wcXhmIn0.EqcbmfVeLhmqEww8t6aUNA" }
          }
      
          Map {
              anchors.fill: parent
              plugin: mapPlugin
              center: QtPositioning.coordinate(-26.715, 27.1033)
              zoomLevel: 15
      
              MapPolygon {
                  id: mapPolygon1
                  color: "blue"
                  path: [
                      {latitude: -26.7115, longitude: 27.1035},
                      {latitude: -26.7209, longitude: 27.0965},
                      {latitude: -26.7199, longitude: 27.1066}
                  ]
              }
      
              MapPolygon {
                  id: mapPolygon2
                  color: "blue"
                  path: [
                      {latitude: -26.7115, longitude: 27.1035},
                      {latitude: -26.7146, longitude: 27.0970},
                      {latitude: -26.7071, longitude: 27.0936}
                  ]
              }
          }
      
          SequentialAnimation {
              id: mapPolygon1Animation
              running: true
              loops: Animation.Infinite
              PropertyAction {
                  target: mapPolygon1
                  property: "color"
                  value: "blue"
              }
              PauseAnimation {
                  duration: 500
              }
              PropertyAction {
                  target: mapPolygon1
                  property: "border.width"
                  value: 5
              }
              PauseAnimation {
                  duration: 500
              }
              PropertyAction {
                  target: mapPolygon1
                  property: "border.color"
                  value: "green"
              }
              PauseAnimation {
                  duration: 500
              }
              PropertyAction {
                  target: mapPolygon1
                  property: "color"
                  value: "red"
              }
              PauseAnimation {
                  duration: 500
              }
              PropertyAction {
                  target: mapPolygon1
                  property: "border.width"
                  value: 1
              }
              PauseAnimation {
                  duration: 500
              }
              PropertyAction {
                  target: mapPolygon1
                  property: "border.color"
                  value: "black"
              }
              PauseAnimation {
                  duration: 500
              }
          }
      
          SequentialAnimation {
              id: mapPolygon2Animation
              running: true
              loops: Animation.Infinite
              PropertyAction {
                  target: mapPolygon2
                  property: "color"
                  value: "blue"
              }
              PauseAnimation {
                  duration: 500
              }
              PropertyAction {
                  target: mapPolygon2
                  property: "color"
                  value: "red"
              }
              PauseAnimation {
                  duration: 500
              }
          }
      }
      

        Attachments

        No reviews matched the request. Check your Options in the drop-down menu of this sections header.

          Activity

            People

            Assignee:
            paangele Paolo Angelelli
            Reporter:
            marlougroenewald Marlou Groenewald
            Votes:
            0 Vote for this issue
            Watchers:
            2 Start watching this issue

              Dates

              Created:
              Updated:
              Resolved:

                Gerrit Reviews

                There are no open Gerrit changes