如何降低图像映射的复杂性?
我在 Linux (Ubuntu) 上使用 KImageMapEditor 来创建图像映射。图像中的形状有点复杂,所以我使用手绘工具来绘制它们。然而,这实际上与多边形工具相同,因此形状最终带有很多点,这使得 HTML 变得非常巨大。
有谁知道减少形状复杂性的方法,例如“平滑”线条?
我还应该提到我希望形状相当准确的原因是因为我打算做这样的事情,其中每个形状在鼠标悬停时突出显示: http://davidlynch.org/js/maphilight/docs/demo_usa.html
I'm using KImageMapEditor on Linux (Ubuntu) to create an image map. The shapes in the image are a little complex so I'm using the freehand tool to draw them. However, this is really the same as the polygon tool so the shapes have ended up with a lot of points, which has made the HTML pretty huge.
Does anyone know of a way to reduce the complexity of the shapes, like "smoothing out" the lines?
I should also mention the reason I want the shapes to be fairly accurate is because I'm intending to do something like this, where each shape is highlighted on mouseover: http://davidlynch.org/js/maphilight/docs/demo_usa.html
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
由于用户不会单击像素,因此请给他们一些余地并创建一个“草率”的地图,该地图粗略地勾勒出每个形状,而不是紧贴实际的像素轮廓。
这与您不希望仅仅因为单击穿过文本的背景而导致单击链接失败相同。您希望文本的边界框充当可点击区域而不是“黑色像素”。
Since users aren't going to click to the pixel, give them some leeway and create a "sloppy" map which roughly outlines each shape instead of clinging to the actual pixel outline.
This is in the same way as you don't expect a click on a link to fail just because you click on the background which shines through the text. You expect the bounding box of the text to act as the click-able area instead of the "black pixels".
算法:给定三个连续点,如果创建的角度小于某个容许误差 e,则消除中间点。
具有角度约束的多边形路径简化
Algorithm: Given three consecutive points, eliminate the middle point if the angle created is less than some tolerated error e.
Polygonal path simplification with angle constraint