Echart, как увеличить масштаб в определенной точке? Пример предоставлен ⇐ Javascript

[Anonymous]

Я использую echart для создания трехмерной поверхности.
Я воспроизвел здесь упрощенную версию https://jsfiddle.net/pw3rqjhy/.

Код: Выделить всё

const chart = echarts.init(document.getElementById('chart'));

function generateSurfaceData() {
const data = [];
const xCount = 50;
const yCount = 50;
for (let i = 0; i < xCount; i++) {
for (let j = 0; j < yCount; j++) {
const x = i / xCount * 50;
const y = j / yCount * 50;
const z = Math.sin(x / 10) * Math.cos(y / 10) * 5;
data.push([x, y, z]);
}
}
return data;
}

chart.setOption({
tooltip: {},
xAxis3D: {
type: 'value',
name: 'X Axis',
min: 0,
max: 50
},
yAxis3D: {
type: 'value',
name: 'Y Axis',
min: 0,
max: 50
},
zAxis3D: {
type: 'value',
name: 'Z Axis',
min: -5,
max: 5
},
grid3D: {
viewControl: {
projection: 'perspective',
},
boxWidth: 100,
boxDepth: 100,
boxHeight: 50
},
series: [{
type: 'surface',
data: generateSurfaceData(),
shading: 'realistic',
realisticMaterial: {
roughness: 0.8,
metalness: 0
}
}]
});

function zoomToPoint(chart, point) {
const [x, y, z] = point;

const option = chart.getOption();

option.grid3D[0].viewControl.distance = 30;

chart.setOption(option);
}

document.getElementById('zoom-button').addEventListener('click', () => {
const pointToZoom = [25, 25, 2.5]; // x, y, z coordinates
zoomToPoint(chart, pointToZoom);
});

Код: Выделить всё

Zoom to Point

Моя проблема в том, что я не могу найти способ увеличить масштаб. конкретная точка, когда пользователь нажимает на кнопку.
Единственное, что указано в документации, - это свойство «center».
Но я не нахожу, кто это работает, и может ли он выполнить эту работу или нет.
https://echarts.apache.org/en/option-gl ... rol.center

Подробнее здесь: https://stackoverflow.com/questions/793 ... e-provided