如何实现一个词云 (7)

如何实现一个词云

其他功能支持 文字大小自适应

在实际使用中,会遇到权重最大的单词比较长的问题,由于字号也设置的比较大,会导致画布无法放置这个单词。解决这个问题,可以对整体进行一个缩放,具体操作是判断到文字超出边界时,扩大board数组,再次进行尝试,直到达到最大缩放比或所有单词均可放置。获取所有单词放置坐标后,将所有单词字号及坐标位置乘以缩放比例即可。

自定义词云形状

可以通过用户上传图片的方式在自定义形状,在实现上,只需要获取图片中有绘制内容的部分,存储为一个数组。在随后的碰撞检测中,也与该数组进行一次比较,就可以达到图像内放置单词的需求。

性能优化 单词缓存

经过测试,在几千个单词时,计算时间将会非常长,经过排查后发现大部分时间消耗在于放置单词的步骤。为此我们增加一个单词缓存,在相同旋转角度下,缓存最大不可放置的宽高,当开始放置时查询到当前单词的宽高大于或等于已缓存的最小宽高时,跳过尝试放置该单词。这个策略在单词量大,且有大量相同字号,相同字数的单词时会有明显优化效果。

参考资料

https://github.com/jasondavies/d3-cloud

https://www.jasondavies.com/wordcloud/about/

字节跳动数据平台前端团队,在公司内负责大数据相关产品的研发。我们在前端技术上保持着非常强的热情,除了数据产品相关的研发外,在数据可视化、海量数据处理优化、web excel、WebIDE、私有化部署、工程工具都方面都有很多的探索和积累,有兴趣可以与我们联系。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zgjjpy.html