diff options
author | Paolo Angelelli <paolo.angelelli@theqtcompany.com> | 2016-01-22 16:19:32 +0100 |
---|---|---|
committer | Paolo Angelelli <paolo.angelelli@qt.io> | 2017-11-29 16:50:20 +0000 |
commit | dd497406d343a60b3173eb6749063abb698c5f1b (patch) | |
tree | c91e4aba28f988ee7cbcbdcaa721515da300a51a /examples/location | |
parent | 13189f0741c755bfbde889e91c67c168faa3709f (diff) | |
download | qtlocation-dd497406d343a60b3173eb6749063abb698c5f1b.tar.gz |
QtLocation mapviewer example MiniMap improvement
The mapviewer example currently uses the minimap to show a red
MapRectangle sized 10 degrees in latitude and 10 degrees in longitude.
This patch makes the minimap visualize the actual displayed area in
the main map as a red rectangle in the minimap.
The minimap zoom level is also now gently bound to the main map zoom
level.
There's one bug left, though, but not related to this qml component, which
causes the border of the red MapRectangle of the minimap to often be drawn
on the left of the rectangle.
Change-Id: I6ba332bf72f0489f5ada765c85f6890a09ca1a98
Reviewed-by: Alex Blasche <alexander.blasche@qt.io>
Diffstat (limited to 'examples/location')
-rw-r--r-- | examples/location/mapviewer/map/MiniMap.qml | 58 |
1 files changed, 47 insertions, 11 deletions
diff --git a/examples/location/mapviewer/map/MiniMap.qml b/examples/location/mapviewer/map/MiniMap.qml index 821879f2..78d2b01e 100644 --- a/examples/location/mapviewer/map/MiniMap.qml +++ b/examples/location/mapviewer/map/MiniMap.qml @@ -49,12 +49,33 @@ ****************************************************************************/ import QtQuick 2.5 +import QtPositioning 5.3 import QtLocation 5.6 Rectangle{ + + function clamp(num, min, max) + { + return num < min ? min : num > max ? max : num; + } + + function minimumScaleFactor() + { + var hscalefactor = (400.0 / Math.max(Math.min(map.width, 1000), 400)) * 0.5 + var vscalefactor = (400.0 / Math.max(Math.min(map.height, 1000), 400)) * 0.5 + return Math.min(hscalefactor,vscalefactor) + } + + function avgScaleFactor() + { + var hscalefactor = (400.0 / Math.max(Math.min(map.width, 1000), 400)) * 0.5 + var vscalefactor = (400.0 / Math.max(Math.min(map.height, 1000), 400)) * 0.5 + return (hscalefactor+vscalefactor) * 0.5 + } + id: miniMapRect - width: 152 - height: 152 + width: Math.floor(map.width * avgScaleFactor()) + 2 + height: Math.floor(map.height * avgScaleFactor()) + 2 anchors.right: (parent) ? parent.right : undefined anchors.rightMargin: 10 anchors.top: (parent) ? parent.top : undefined @@ -66,25 +87,40 @@ Rectangle{ anchors.topMargin: 1 anchors.left: parent.left anchors.leftMargin: 1 - width: 150 - height: 150 - zoomLevel: (map.zoomLevel > minimumZoomLevel + 3) ? minimumZoomLevel + 3 : 2.5 + width: Math.floor(map.width * avgScaleFactor()) + height: Math.floor(map.height * avgScaleFactor()) + zoomLevel: clamp(map.zoomLevel - 4.5, 2.0, 5.0) //(map.zoomLevel > minimumZoomLevel + 3) ? minimumZoomLevel + 3 : 1.5 center: map.center plugin: map.plugin gesture.enabled: false copyrightsVisible: false + property double mapZoomLevel : map.zoomLevel + + // cannot use property bindings on map.visibleRegion in MapRectangle because it's non-NOTIFYable + onCenterChanged: miniMapRectangle.updateCoordinates() + onMapZoomLevelChanged: miniMapRectangle.updateCoordinates() + onWidthChanged: miniMapRectangle.updateCoordinates() + onHeightChanged: miniMapRectangle.updateCoordinates() MapRectangle { + id: miniMapRectangle color: "#44ff0000" border.width: 1 border.color: "red" - topLeft { - latitude: miniMap.center.latitude + 5 - longitude: miniMap.center.longitude - 5 + + function getMapVisibleRegion() + { + return QtPositioning.shapeToRectangle(map.visibleRegion) } - bottomRight { - latitude: miniMap.center.latitude - 5 - longitude: miniMap.center.longitude + 5 + + function updateCoordinates() + { + topLeft.latitude = getMapVisibleRegion().topLeft.latitude + topLeft.longitude= getMapVisibleRegion().topLeft.longitude + bottomRight.latitude = getMapVisibleRegion().bottomRight.latitude + bottomRight.longitude= getMapVisibleRegion().bottomRight.longitude + console.log("TopLeft: " + topLeft) + console.log("BotRigh: " + bottomRight) } } } |