如何获得KineticJS Path对象的Bounding Box

Question

我有一个带有定义的SVG Path数据的KineticJS Path对象。它在屏幕上渲染得很好。

我现在需要获取该路径对象的边界框（复杂形状）。

如何获取定义的KineticJS路径的边界框？

Answer 1

KineticJS没有办法获得它绘制的SVG路径的边界框。

您有几个复杂的选项来获取该边界框。

以下是最简单的选择......

• 使用该路径创建一个offscreen svg元素，并使用此SVG命令获取边界框：yourPath.getBBox（）

• 使用将SVG路径转换为Canvas绘图命令的KineticJS源，并“走”这些线+曲线以确定maxXY和minXY点。 KineticJS来源位于：https://github.com/ericdrowell/KineticJS/blob/master/src/plugins/Path.js

• 使用yourPath.toImage获取Kinetic.Path的图像。然后将该图像绘制到屏幕外的画布上。然后使用context.getImageData获取图像的像素数据。检查每个垂直列和每个水平像素行，以确定非透明像素的开始/结束位置。

再一次，获得你的边界框肯定是可能的，但不适合那些胆小的编码器。如果您在编写边界框解决方案时遇到问题，请在StackOverflow上寻求其他帮助。