main.qml Example File
qmlmultigraph/qml/qmlmultigraph/main.qml
import QtQuick 2.1
import QtQuick.Layouts 1.0
import QtDataVisualization 1.0
import "."
Rectangle {
id: mainView
width: 800
height: 600
Data {
id: data
}
GridLayout {
id: gridLayout
columns: 2
Layout.fillHeight: true
Layout.fillWidth: true
anchors.top: mainView.top
anchors.bottom: mainView.bottom
anchors.left: mainView.left
anchors.right: mainView.right
Rectangle {
Layout.fillHeight: true
Layout.fillWidth: true
border.color: surfaceGraph.theme.gridLineColor
border.width: 2
Surface3D {
id: surfaceGraph
anchors.fill: parent
anchors.margins: parent.border.width
theme: Theme3D {
type: Theme3D.ThemePrimaryColors
font.pointSize: 60
}
scene.activeCamera.cameraPreset: Camera3D.CameraPresetIsometricLeftHigh
Surface3DSeries {
itemLabelFormat: "Pop density at (@xLabel N, @zLabel E): @yLabel"
ItemModelSurfaceDataProxy {
itemModel: data.sharedData
rowRole: "row"
columnRole: "col"
xPosRole: "latitude"
zPosRole: "longitude"
yPosRole: "pop_density"
}
}
}
}
Rectangle {
Layout.fillHeight: true
Layout.fillWidth: true
GridLayout {
anchors.right: parent.right
anchors.left: parent.left
anchors.top: parent.top
anchors.bottom: parent.bottom
columns: 2
NewButton {
Layout.minimumWidth: parent.width / 2
Layout.fillHeight: true
Layout.fillWidth: true
text: "Clear Selections"
onClicked: clearSelections()
}
NewButton {
Layout.minimumWidth: parent.width / 2
Layout.fillHeight: true
Layout.fillWidth: true
text: "Quit"
onClicked: Qt.quit(0);
}
NewButton {
Layout.fillHeight: true
Layout.fillWidth: true
text: "Reset Cameras"
onClicked: resetCameras()
}
NewButton {
Layout.fillHeight: true
Layout.fillWidth: true
text: "Toggle Mesh Styles"
onClicked: toggleMeshStyle()
}
}
}
Rectangle {
Layout.fillHeight: true
Layout.fillWidth: true
border.color: scatterGraph.theme.gridLineColor
border.width: 2
Scatter3D {
id: scatterGraph
anchors.fill: parent
anchors.margins: parent.border.width
theme: Theme3D {
type: Theme3D.ThemeDigia
font.pointSize: 60
}
scene.activeCamera.cameraPreset: Camera3D.CameraPresetIsometricLeftHigh
Scatter3DSeries {
itemLabelFormat: "Pop density at (@xLabel N, @zLabel E): @yLabel"
ItemModelScatterDataProxy {
itemModel: data.sharedData
xPosRole: "latitude"
zPosRole: "longitude"
yPosRole: "pop_density"
}
}
}
}
Rectangle {
Layout.fillHeight: true
Layout.fillWidth: true
border.color: barGraph.theme.gridLineColor
border.width: 2
Bars3D {
id: barGraph
anchors.fill: parent
anchors.margins: parent.border.width
theme: Theme3D {
type: Theme3D.ThemeQt
font.pointSize: 60
}
selectionMode: AbstractGraph3D.SelectionItemAndRow | AbstractGraph3D.SelectionSlice
scene.activeCamera.cameraPreset: Camera3D.CameraPresetIsometricLeftHigh
Bar3DSeries {
itemLabelFormat: "@seriesName: @valueLabel"
name: "Population density"
ItemModelBarDataProxy {
itemModel: data.sharedData
rowRole: "row"
columnRole: "col"
valueRole: "pop_density"
}
}
}
}
}
function clearSelections() {
barGraph.clearSelection()
scatterGraph.clearSelection()
surfaceGraph.clearSelection()
}
function resetCameras() {
surfaceGraph.scene.activeCamera.cameraPreset = Camera3D.CameraPresetIsometricLeftHigh
scatterGraph.scene.activeCamera.cameraPreset = Camera3D.CameraPresetIsometricLeftHigh
barGraph.scene.activeCamera.cameraPreset = Camera3D.CameraPresetIsometricLeftHigh
surfaceGraph.scene.activeCamera.zoomLevel = 100.0
scatterGraph.scene.activeCamera.zoomLevel = 100.0
barGraph.scene.activeCamera.zoomLevel = 100.0
}
function toggleMeshStyle() {
if (barGraph.seriesList[0].meshSmooth === true) {
barGraph.seriesList[0].meshSmooth = false
if (surfaceGraph.seriesList[0].flatShadingSupported)
surfaceGraph.seriesList[0].flatShadingEnabled = true
scatterGraph.seriesList[0].meshSmooth = false
} else {
barGraph.seriesList[0].meshSmooth = true
surfaceGraph.seriesList[0].flatShadingEnabled = false
scatterGraph.seriesList[0].meshSmooth = true
}
}
}