如何在LightningChart的Chart3D鼠标点击时获取Z值？

针对你的需求，可通过表面系列（SurfaceScrollingGridSeries）的内置方法直接获取点击位置对应的Z值，以下是具体实现：

修改后的点击事件代码 #

const clickListener = surfaceSeries3D.onMouseClick((_, event) => {
    // 将客户端坐标转换为图表相对坐标系坐标
    const relativeCoords = chart3D.translateCoordinate(event, chart3D.coordsRelative);
    
    // 方法1：获取数据集中最接近点击位置的点的Z值
    const targetPoint = surfaceSeries3D.getPointAt(relativeCoords.x, relativeCoords.y);
    if (targetPoint) {
        console.log('点击位置的Z值:', targetPoint.z);
        // 若需判断是否为黄色形状，可结合点的颜色或数据范围筛选
        // 例如：if (targetPoint.color === '#FFFF00') { ... }
    }

    // 方法2：通过插值计算精确Z值（适合网格类数据）
    const interpolatedZ = surfaceSeries3D.interpolateValues(relativeCoords.x, relativeCoords.y).z;
    console.log('插值后的精确Z值:', interpolatedZ);
});

关键说明 #

• getPointAt(x, y)：返回数据集中距离指定坐标最近的点对象，包含完整的x/y/z属性，适合离散数据场景
• interpolateValues(x, y)：基于周围数据点进行插值计算，返回更精确的Z值，适合连续网格表面的场景
• 若需仅获取黄色形状的Z值，需提前在数据或系列样式中定义黄色区域的判断规则（比如数据范围、颜色映射），再在点击事件中过滤

内容的提问来源于stack exchange，提问作者kood