qt的qml绘制三维坐标系

### 使用 Qt QML 绘制三维坐标系 为了在 QML 中绘制三维笛卡尔坐标系并添加折线，可以利用 `QtQuick3D` 模块中的组件。此模块提供了丰富的 3D 图形渲染能力，适用于创建复杂的 3D 场景。 #### 创建基本场景 首先，在应用程序中引入必要的模块： ```qml import QtQuick import QtQuick.Window import QtQuick3D ``` 定义窗口和视口布局，设置相机视角以便更好地观察 3D 对象： ```qml Window { visible: true width: 800 height: 600 title: qsTr("3D Coordinate System") View3D { anchors.fill: parent environment: SceneEnvironment { backgroundMode: SceneEnvironment.Color clearColor: "#ffffff" } PerspectiveCamera { id: camera position: Qt.vector3d(0, 0, 400) eulerRotation.x: -25 } DirectionalLight { color: "white" worldDirection: Qt.vector3d(-1, -1, -1).normalized() } } } ``` 上述代码设置了白色背景的 3D 视图环境，并配置了一个透视摄像机以及方向光源[^1]。 #### 构建轴线模型 接下来构建 X、Y、Z 轴线段作为坐标系统的组成部分。每条轴由两个节点表示——起点和终点，并应用不同的颜色区分各个维度： ```qml Model { source: "#Cylinder" materials: [ DefaultMaterial { diffuseColor: "red" }, // X-axis (Red) DefaultMaterial { diffuseColor: "green"},// Y-axis (Green) DefaultMaterial { diffuseColor: "blue"} // Z-axis (Blue) ] scale: Qt.vector3d(0.05, 200, 0.05) transform: Translate { translation: Qt.vector3d( index === 0 ? 100 : 0, index === 1 ? 100 : 0, index === 2 ? 100 : 0 ) } property int axisIndex: index Repeater { model: ["X", "Y", "Z"] delegate: Model { source: "#Sphere" materials: [DefaultMaterial {}] scale: Qt.vector3d(0.5, 0.5, 0.5) Transform { translation: Qt.vector3d( parent.axisIndex === 0 ? 100 : 0, parent.axisIndex === 1 ? 100 : 0, parent.axisIndex === 2 ? 100 : 0 ) } } } } ``` 这段脚本重复三次分别生成红色、绿色和蓝色的小球体标记各轴端点位置；同时使用圆柱体连接这些顶点形成连续的线条代表相应轴向。 #### 实现交互式缩放功能 为了让用户可以通过滚动鼠标滚轮调整显示比例，可以在根元素上监听 `wheel` 事件，并据此修改摄像机的位置参数实现平滑变焦效果： ```qml MouseArea { anchors.fill: parent acceptedButtons: Qt.AllButtons | Qt.NoButton propagateComposedEvents: true onWheel: { const delta = wheel.angleDelta.y / 120 * 10; let newPos = camera.position; newPos.z -= delta; if(newPos.z >= 1 && newPos.z <= 1000){ camera.position = newPos; } } } ``` 以上片段实现了基于鼠标的简单缩放机制，允许用户通过垂直移动滚轮改变当前视角距离物体的距离范围内的任意值。