建立“内笔画” 多边形的效果
我正在绘制一大堆多边形 到画布上,其中大部分与至少一个其他多边形共享一条边。 我想通过勾勒出多边形的轮廓来表明它是“特殊的”,但是由于重叠的边缘,多边形上的笔画往往会被另一个多边形部分绘制,导致笔画在某些地方看起来比应有的要细。 此外,根据绘制顺序,多边形的描边可能几乎完全被周围的描边覆盖。 将多边形间隔开并不是一个非常有吸引力的选择,因为多边形之间的可见间隙对于这种“细笔画”问题来说不太可取。
我的原因是,我正在寻找的效果可以通过将每个多边形生成为一对多边形来实现,这样一个多边形完全包含在另一个多边形中,并且这个较小的多边形的笔划延伸到(但不重叠)外部多边形的描边。 内部多边形始终具有透明的填充,并且仅当我希望表明现在的一对多边形是“特殊的”时才具有不透明的描边。
我的问题归结为; 我怎样才能从外部多边形导出这样一个内部多边形,或者如果失败的话我怎样才能达到这种效果?
如果需要的话,有问题的多边形可以限制为规则多边形,并且笔画很简单1 粗实线,没有花哨的斜接或类似的东西。 我希望能够在某个时候调整描边的粗细,但没有什么比这更奇特的了。
I'm drawing a whole bunch of Polygons onto a canvas, most of which share an edge with at least one other Polygon. I'd like to indicate a Polygon is "special" by outlining it, however due to the overlapping edges the Stroke on a Polygon tends to be partially drawn over by another Polygon causing the Stroke to look thinner than it should in places. Additionally, depending on draw order, a Polygon may have its Stroke almost entirely covered by those around it. Spacing the Polygons out is not a very attractive option, as visible gaps between Polygons are much less preferable to this "thin stroke" problem.
I reason that the effect I'm looking for can be achieved by generating each Polygon as a pair of Polygons instead, such that one Polygon is completely contained within the other and this smaller Polygon's Stroke runs up to (but does not overlap) the outer Polygon's Stroke. The inner Polygon would have a transparent Fill at all times, and a non-transparent Stroke only when I wish to indicate that the now pair of Polygons are "special".
My question boils down to; how can I derive such an inner Polygon from the outer one, or failing that how else might I achieve this effect?
The Polygon's in question can be constrained to the regular polygons if need be, and the Strokes are simple 1 thickness solid lines with no fancy miters or the like. I'd like to be able to adjust the thickness of the Stroke at some point, but nothing fancier than that.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我认为实际上有几种方法可以实现你想要的。
首先,按照您最初的想法在原始多边形内绘制第二个稍小的多边形; 这不是一个坏主意。 要回答有关如何生成较小多边形的原始问题:您可以找到每个多边形的质心,并将每个顶点偏移到多边形质心点的距离的百分比以获得较小的多边形。 这应该会产生令人满意的效果。
您可以采用的另一种方法是使用 z 顺序,并将“较厚”的多边形偏移一个轻微的负 z 距离。
另一种方法是利用绘图顺序。 最后绘制较厚的多边形,这将防止它们被周围的多边形过度绘制。
根据您的需要,另一个可行的想法可能是根本不绘制多边形,而是绘制一系列线条,只是加粗一些线条。
有很多选择供您尝试; 希望您能找到一款效果好的!
I think there's actually a few ways to achieve what you want.
First, going with your original idea of drawing a second, slightly smaller polygon within the original polygon; it's not a bad idea. To answer your original question as to how to generate the smaller polygon: you can find the centroid of each polygon, and offset each vertex by a percentage of the distance to that centroid point of the polygon to get the smaller polygon. This should give a pleasing effect.
Another way you could go would be to use z-order, and offset the "thicker" polygon by a slight negative z-distance.
Yet another way to go would be to exploit draw order; draw your thicker polygons last, which will prevent them from being overdrawn by the surrounding polygons.
Yet another idea that might work depending on your needs might be not to draw polygons at all, but to draw a series of lines, simply thickening some of the lines.
There's a lot of options for you to try; hope you find one that works out well!