在颤动中绘制三维散点图

Question

我正在寻找一个flutter软件包，用于绘制给定一系列X，Y，Z和R，G，B值的3D散射碎片。希望输出如下所示的内容：https://photos.app.goo.gl/VtwTxnqHY4ahc24u6

我知道echarts可以做3d散点图，但我需要它在移动和网络上工作

问:有没有人知道一个flutter软件包，我可以用它来绘制手机和网络的3d散点图？

Answer 1

如果有意愿，就有办法，我不知道有什么包，但你可以很容易地自己实现它：

1:导入包vector_math64

import 'package:vector_math/vector_math_64.dart' as vm;

2:制作投影矩阵。

vm.Matrix4 perspectiveMatrix = vm.makePerspectiveMatrix(vm.radians(150), 16/9,3, 20);

3:制作一个用于移动绘图的Vector3、一个用于旋转绘图的3x3旋转矩阵和另一个用于缩放绘图的Vector3。

vm.Vector3 location = vm.Vector3.array([100,-200,300]);

vm.Matrix3 rotation = vm.Matrix3.identity();
rotation.setRotationX(vm.radians(xRot));
rotation.setRotationY(vm.radians(yRot));
rotation.setRotationZ(vm.radians(zRot));

vm.Vector3 scale = vm.Vector3.array([1,1,1]);

4:使用这些，建立一个从本地坐标系到世界坐标系的投影矩阵

vm.Matrix4 localToWorldMatrix = Matrix4.compose(location, vm.Quaternion.fromRotation(rotation), scale);

5:您的最终投影矩阵将是：

vm.Matrix4 finalMatrix = perspectiveMatrix*localToWorldMatrix;

6:如果更改旋转，则在每次绘制/更新之前重新计算矩阵

7:创建一个CustomPainter

8:将点列表保存为vm.Vector3

List<vm.Vector3> points = [...]

9:在更新函数中:使用vector.clone()复制所有点，应用投影并将它们放到另一个列表中

List<vm.Vector3> cloneList = [];
points.forEach((element) { 
  vm.Vector3 clone = element.clone();
  clone.applyProjection(finalMatrix);
  cloneList.add(clone);
});

10:在你的绘图函数中绘制点：

cloneList.forEach((element) {   
  canvas.drawCircle(Offset(element.storage[0]*size.width,element.storage[1]
  *size.height), 1, Paint()..color = Colors.red);
});

11:为坐标系设置4个点：(0,0,0)，(10,0,0)，(0,10,0)，(0,0,10)。

12:将投影应用于坐标系的4个点，绘制线条，然后准备就绪