Enable mercator-to-screen projection in GLSL

With this change, all the geo-to-screen conversion,
and the triangulation operations for geo polylines
and geo polygon are performed either at set time
or in the shader.
A separate bounding box geometry is processed
in the old way to provide a correct QtQuick Item
geometry, that can be used for nesting mouse areas,
performing translations, input event delivery, etc.

With this approach, performance are improved by more
than one order of magnitude in average, but complex
geometries will of course benefit more.

It also adds correct rendering support for polygons
with holes, previously only rendered correctly
by the MapboxGL plugin.

The polyline shader has basic miter joins. The miter is
skipped if the angle is too sharp to avoid complicating
the implementation.
This shader introduces some glitches when the polyline
is minified, for which the real fix is to
have LOD for the geometry, and render simplified
geometries at low zoom levels (added in a subsequent patch).

Note: this approach, at least in its current implementation,
does not support enabling layers on individual items, only
on the Map element.

Task-number: QTBUG-49303
Task-number: QTBUG-38459
Change-Id: I0c2dc0bf364d32f74ca7c4014f6d66e6219c8ae4
Reviewed-by: Alexandru Croitor <alexandru.croitor@qt.io>

1 files changed, 327 insertions, 0 deletions

diff --git a/tests/manual/mappolyline_tester/main.qml b/tests/manual/mappolyline_tester/main.qml
new file mode 100644
index 00000000..82e67a21
--- /dev/null
+++ b/tests/manual/mappolyline_tester/main.qml
@@ -0,0 +1,327 @@
+/****************************************************************************
+**
+** Copyright (C) 2020 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the test suite of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:GPL-EXCEPT$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU
+** General Public License version 3 as published by the Free Software
+** Foundation with exceptions as appearing in the file LICENSE.GPL3-EXCEPT
+** included in the packaging of this file. Please review the following
+** information to ensure the GNU General Public License requirements will
+** be met: https://www.gnu.org/licenses/gpl-3.0.html.
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.7
+import QtQuick.Window 2.2
+import QtQuick.Controls 2.13 as C2
+import QtPositioning 5.6
+import QtLocation 5.15
+
+Window {
+    id: win
+    visible: true
+    width: 1600
+    height: 800
+    title: qsTr("MapPolyline tester")
+
+    property real initialZL:  4
+    property var initialCenter:  QtPositioning.coordinate(55, -160)
+    property real rotation : 0
+
+    Shortcut {
+        sequence: "Ctrl+R"
+        onActivated: {
+            rotation = rotation + 36
+        }
+    }
+
+    function syncMaps(mFrom, mTo, propName)
+    {
+        if (mTo[propName] !== mFrom[propName]) {
+            mTo[propName] = mFrom[propName]
+        }
+    }
+
+    Plugin {
+        id: osm // use only one plugin, to avoid messing up the cache
+        name: "osm"
+    }
+    Rectangle {
+        id: mapContainer
+        rotation: win.rotation
+        anchors.fill: parent
+        color: "lightsteelblue"
+
+        Map {
+            id: map
+            rotation: win.rotation
+            gesture.enabled: true
+            objectName: "map1"
+            anchors {
+                bottom: parent.bottom
+                top: parent.top
+                left: parent.left
+                right: (leftSwitch.checked) ? parent.right : parent.horizontalCenter
+            }
+
+            onCenterChanged:        syncMaps(map, map2, "center")
+            onTiltChanged:          syncMaps(map, map2, "tilt")
+            onBearingChanged:       syncMaps(map, map2, "bearing")
+            onZoomLevelChanged:     syncMaps(map, map2, "zoomLevel")
+            onFieldOfViewChanged:   syncMaps(map, map2, "fieldOfView")
+
+            opacity: 1.0
+            color: 'transparent'
+            plugin: osm
+            center: initialCenter
+            activeMapType: map.supportedMapTypes[2]
+            zoomLevel: initialZL
+            z : parent.z + 1
+            copyrightsVisible: false
+
+            Component.onCompleted: {
+                var o = migComponent.createObject(map)
+                o.glPolylines  = Qt.binding(function() {return switchPolylines1.currentText})
+                map.addMapItemGroup(o);
+            }
+            MouseArea {
+                anchors.fill: parent
+                onClicked: {
+                    mouse.accepted = false
+                    var crd = map.toCoordinate(Qt.point(mouse.x, mouse.y))
+                    var s = crd.toString(0)
+                    console.log("Clicked the map (not an Item) on ",s)
+                }
+            }
+
+            C2.ComboBox {
+                model: ['Software','OpenGL LineStrip','OpenGL Triangles']
+                id: switchPolylines1
+                anchors {
+                    top: parent.top
+                    right: parent.right
+                    topMargin: 12
+                    rightMargin: 12
+                }
+            }
+        }
+        Map {
+            id: map2
+            rotation: win.rotation
+            gesture.enabled: true
+            objectName: "map2"
+            visible: !leftSwitch.checked
+            anchors {
+                bottom: parent.bottom
+                top: parent.top
+                left: parent.horizontalCenter
+                right: parent.right
+            }
+
+            onCenterChanged:        syncMaps(map2, map, "center")
+            onTiltChanged:          syncMaps(map2, map, "tilt")
+            onBearingChanged:       syncMaps(map2, map, "bearing")
+            onZoomLevelChanged:     syncMaps(map2, map, "zoomLevel")
+            onFieldOfViewChanged:   syncMaps(map2, map, "fieldOfView")
+
+            color: 'transparent'
+            plugin: osm
+            activeMapType: map.supportedMapTypes[2]
+            center: initialCenter
+            zoomLevel: initialZL
+            copyrightsVisible: false
+
+            Component.onCompleted: {
+                var o = migComponent.createObject(map2)
+                o.glPolylines  = Qt.binding(function() {return switchPolylines2.currentText})
+                map2.addMapItemGroup(o);
+            }
+
+            C2.ComboBox {
+                model: ['Software','OpenGL LineStrip','OpenGL Triangles']
+                id: switchPolylines2
+                anchors {
+                    top: parent.top
+                    right: parent.right
+                    topMargin: 12
+                    rightMargin: 12
+                }
+                onCurrentTextChanged: console.log("CURRENT TEXT CHANGED ",currentText)
+            }
+        }
+    }
+
+    Component {
+        id: migComponent
+        MapItemGroup {
+            id: polyGroup
+            property bool glPolygons : true
+            property string glPolylines : "Software"
+            property bool glCircles : true
+            property bool glRectangles : true
+            objectName: parent.objectName + "_MIG_"
+
+            function polylineBackend()
+            {
+                return (polyGroup.glPolylines === "OpenGL LineStrip")
+                       ? MapPolyline.OpenGLLineStrip
+                       :  ((polyGroup.glPolylines === "Software")
+                           ? MapPolyline.Software : MapPolyline.OpenGLExtruded)
+            }
+
+            function polygonBackend()
+            {
+                return (polyGroup.glPolylines === "Software")
+                       ? MapPolygon.Software : MapPolygon.OpenGL
+            }
+
+            function miterValue()
+            {
+                return (miterSwitch.checked) ? Qt.RoundCap : Qt.FlatCap
+            }
+
+            MapPolyline {
+                id: tstPolyLine // to verify the polygon stays where it's supposed to
+                line.color: 'black'
+                objectName: parent.objectName + "black"
+                line.width: 1
+                opacity: 1.0
+                backend: polylineBackend()
+                path: [
+                    { latitude: 76.9965, longitude: -175.012 },
+                    { latitude: 26.9965, longitude: -175.012 }
+                ]
+            }
+
+            MapPolyline {
+                id: timeline
+                line.color: "red"
+                objectName: parent.objectName + "timeline"
+                line.width: 4
+                backend: polylineBackend()
+                path: [
+                    { latitude: 90, longitude: 180 },
+                    { latitude: -90, longitude: -180 }
+                ]
+            }
+
+            MapPolyline {
+                id: poly1
+                line.color: "pink"
+                line.width: sliWidth.value
+                objectName: parent.objectName + "red"
+                backend: polylineBackend()
+
+                path: [
+                    { latitude: 55, longitude: 170 },
+                    { latitude: 66.9965, longitude: 170 },
+                    { latitude: 66.9965, longitude: -175.012 },
+                    { latitude: 55, longitude: -160 },
+                    { latitude: 40, longitude: -165 },
+                    { latitude: 45, longitude: 174 },
+                    { latitude: 43, longitude: -168 }
+                ]
+                DynamicParameter {
+                    type: "lineStyle"
+                    property var lineCap: miterValue()
+                }
+
+                MouseArea {
+                    anchors.fill: parent
+                    onClicked: console.log("poly1 in "+parent.parent.objectName + "clicked")
+
+                    Rectangle { // this is technically unsupported, but practically works.
+                        color: "transparent"
+                        border.color: "red"
+                        anchors.fill: parent
+                    }
+                }
+            }
+
+            MapPolygon {
+                id: poly2
+                color: "green"
+                border.color: "black"
+                border.width: 12
+                objectName: parent.objectName + "green"
+                backend: polygonBackend()
+                path: [
+                    { latitude: -45, longitude: -170 },
+                    { latitude: -55, longitude: -155 },
+                    { latitude: -45, longitude: -130 },
+                    { latitude: -35, longitude: -155 }
+                ]
+                MouseArea{
+                    anchors.fill: parent
+                    drag.target: parent
+                    Rectangle { // this is technically unsupported, but practically works.
+                        color: "transparent"
+                        border.color: "red"
+                        anchors.fill: parent
+                    }
+                }
+            }
+
+//            LongPolyline {
+//                id: longPolyline
+//                line.width: 10
+//                line.color: 'firebrick'
+//                backend: polylineBackend()
+//            }
+        }
+    }
+
+
+    C2.Switch {
+        text: qsTr("Left")
+        id: leftSwitch
+        anchors {
+            top: parent.top
+            left: parent.left
+            leftMargin: 12
+            rightMargin: 12
+        }
+        checked: false
+    }
+    C2.Switch {
+        text: qsTr("Miter")
+        id: miterSwitch
+        anchors {
+            top: leftSwitch.bottom
+            left: parent.left
+            leftMargin: 12
+            rightMargin: 12
+        }
+        checked: false
+    }
+    C2.Slider {
+        id: sliWidth
+        orientation: Qt.Vertical
+        anchors {
+            left: parent.left
+            top: miterSwitch.bottom
+            bottom: parent.bottom
+            topMargin: 10
+            leftMargin: 10
+            bottomMargin: 10
+        }
+        from: 1
+        to: 50
+        value: 50
+    }
+}