设为首页 加入收藏

TOP

OpenGL绘制矢量路径的思路
2014-11-24 00:58:12 来源: 作者: 【 】 浏览:2
Tags:OpenGL 绘制 矢量 路径 思路

通过纹理方式实现抗锯齿单色路径绘制。


建模算法非常简单:将一个polyline分解成一些列两点的线段,单独对每个线段建模,如下图0132和4576处贴两个半圆,2354用宽度为1的像素条放样生成。线段的末端是半圆,所以线段与线段之间能很好地衔接。



思路来源:http://answers.oreilly.com/topic/1669-how-to-render-anti-aliased-lines-with-textures-in-ios-4/


注意:如果贴图是半透明的,拐角处纹理会增强,效果不理想,如下图,所以该建模算法只适合单色不透明路径。



现在各家手机地图中路线都是立体纹理绘制,纹理效果如下图:



实现立体路径绘制,建模算法的难点在拐角处处理,尤其锐角,角度很小的时候如何处理。经过一段时间的研究,实现了一种简单而且足够鲁邦的算法,思路非常简单:锐角的时候进行插值(使用的是三次样条插值),将锐角转化成钝角,钝角的时候建模算法如下图:



如上图,一个建模处理单元由三个点组成,P0,P1,P2组成且夹角为钝角,路径宽度为2*radius,建模思路如下:


T1 = normalize( P1-P0 ); // P0P1 单位向量
N1 = Vec2f( -T1.y, T1.x); // 法线向量可以直接写出
v0 = P0 + radius * N1; // 右手法则,v0方向为正
v1 = p0 - radius * N1;
v2 = P1 + radius * N1;
v3 = P1 - radius * N1;


T2 = normalize( P2-P1 ); // P0P1 单位向量
N2 = Vec2f( -T2.y, T2.x); // 法线向量可以直接写出
v4 = P1 + radius * N2;
v5 = p1 - radius * N2;
v6 = P2 + radius * N2;
v7 = P2 - radius * N2;


verticesList: v0, v1, v2, v3, v4, v5, v6, v7
triangleIndexList: 0,1,2, 2,1,3, 2,4,5, 2,5,4, 2,3,4, 2,4,3, 4,5,6 6,5,7


相关阅读


】【打印繁体】【投稿】【收藏】 【推荐】【举报】【评论】 【关闭】 【返回顶部
分享到: 
上一篇LRU缓存设计 下一篇OpenGL错误和性能Tips

评论

帐  号: 密码: (新用户注册)
验 证 码:
表  情:
内  容: