通过点击vtk的renderWindow,获取坐标点。
获取点的坐标有vtkCellPicker和vtkPointPicker两个方法,区别在于vtkCellPicker可以区分是否点击在模型上,推荐使用vtkCellPicker。
获取两点之间距离使用vtkMath的方法,vtkMath.distance2BetweenPoints(point1, point2), 结果需要开平方。
// 初始化vtk
import vtkFullScreenRenderWindow from '@kitware/vtk.js/Rendering/Misc/FullScreenRenderWindow'
const div = this.$refs.modelBox
const fullScreenRenderer = vtkFullScreenRenderWindow.newInstance({
container: div,
background: [0, 0, 0]
})
this.renderer = fullScreenRenderer.getRenderer()
this.renderWindow = fullScreenRenderer.getRenderWindow()
this.renderWindow.getInteractor().render()
import vtkInteractorStyleImage from '@kitware/vtk.js/Interaction/Style/InteractorStyleImage'
// 设置可点击
const interactorStyle = vtkInteractorStyleImage.newInstance()
this.renderWindow.getInteractor().setInteractorStyle(interactorStyle)
const mainInteractor = this.renderWindow.getInteractor()
// 鼠标左键点击
mainInteractor.onLeftButtonPress((callData) => {
if (this.renderer !== callData.pokedRenderer) {
return
}
})
获取在模型上点击的点(vtkCellPicker)
import vtkCellPicker from '@kitware/vtk.js/Rendering/Core/CellPicker'
mainInteractor.onLeftButtonPress((callData) => {
if (this.renderer !== callData.pokedRenderer) {
return
}
const pos = callData.position
const screenPoint = [pos.x, pos.y, pos.z]
const actor = ... // 模型
const picker = vtkCellPicker.newInstance()
picker.setPickFromList(1)
picker.setTolerance(0)
picker.initializePickList()
picker.addPickList(actor)
picker.pick(screenPoint, this.renderer)
if (picker.getActors().length > 0) { // 在模型上点击
const pickedPoints = picker.getPickedPositions()[0]
// 获取模型当前点击的世界坐标
console.log(pickedPoints)
} else { // 在模型外点击
const pickedPoint = picker.getPickPosition()
// 获取模型当前点击的世界坐标
console.log(pickedPoint)
}
})
获取点击vtkJs renderWindow的点(vtkPointPicker)
import vtkPointPicker from '@kitware/vtk.js/Rendering/Core/PointPicker'
mainInteractor.onLeftButtonPress((callData) => {
if (this.renderer !== callData.pokedRenderer) {
return
}
const pointPicker = vtkPointPicker.newInstance()
pointPicker.pick(screenPoint, this.renderer)
const pickedPoints = pointPicker.getPickPosition()
console.log(pickedPoints) // 点击的点世界坐标
})
获取两点之间的距离
import * as vtkMath from '@kitware/vtk.js/Common/Core/Math'
// point1、point2可通过点击获取
const point1 = [...] // 起始点(世界坐标)
const point2 = [...] // 结束点(世界坐标)
const pointLen = vtkMath.distance2BetweenPoints(point1, point2)
const distance = Math.sqrt(pointLen)
console.log(`两点之间的距离:${distance}mm`)