Dashboards

Cartograph Maps 3.8.1 (will be released in August 2025) adds support for dashboards.

Dashboards are fully customizable and provide means for viewing data (e.g., track statistics, sensor data, map position data), and for controlling parts of the app (track recording, add way points, move/zoom/tilt/rotate the map).

There are two types of dashboards: “Overlay” dashboards are transparent and are shown on top of the map. “Fullscreen” dashboards cover the whole screen (including the map).

You can download example dashboards here:

• Zip package containing examples: Download
• Installer package which will install the examples directly in Cartograph Maps: Download

How to create your own dashboards

Cartograph Maps supports user-created dashboards (stored in the app’s “Dashboards” sub-directory). Dashboards are created using the Qml language.

The following code shows a simple overlay dashboard:

//Name=Example: Speed and Power overlay
//Type=overlay

/**
  * This example shows how to overlay sensor data on top
  * of the map using an "overlay" dashboard.
 **/

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtSensors
import QtQuick.Shapes
import QtQuick.Window

import com.mobwheel  // this is necessary for accessing data from Cartograph Maps

Item {
    ColumnLayout {
        id: col
        anchors.top: parent.top
        anchors.topMargin: 100
        anchors.horizontalCenter: parent.horizontalCenter

        property var unitsHandler: AppInstance.cartographApplicationManager.unitsHandler
        property var sensorManager: AppInstance.cartographApplicationManager.sensorManager

        // Speed
        Label {
            font.bold: true
            font.pointSize: 20
            Layout.fillWidth: true
            horizontalAlignment: Label.AlignHCenter
            text: col.unitsHandler.getStringForSpeed(col.sensorManager.speed)
            background: Rectangle {
                color: "black"
                opacity: 0.5
                radius: 4
            }
        }

        // Power
        Label {
            font.bold: true
            font.pointSize: 20
            Layout.fillWidth: true
            horizontalAlignment: Label.AlignHCenter
            text: col.sensorManager.power.toFixed() + " W"
            background: Rectangle {
                color: "black"
                opacity: 0.5
                radius: 4
            }
        }
    }
}

The first line, which has to start with “//Name=” defines the name of the dashboard which will be shown in Cartograph Maps.
The second line has to start with “//Type=” and defines whether the dashboard is an “overlay” or “fullscreen“.