上传者: 38670391
|
上传时间: 2022-02-18 17:17:20
|
文件大小: 96KB
|
文件类型: -
本文实例讲述了vue实现标签云效果的方法。分享给大家供大家参考,具体如下:
闲扯两句
最近想给自己的博客上加上一个3D标签云的效果,用来表示自己博客文章的分组,网上找到了canvas实现的,还有a元素实现的解析3D标签云,我想让标签可以选择和点击,又不想在标签数量较多时操作a标签导致性能问题,于是svg就成了一个不错的选择。
标签初始化
这里实现的核心主要是参考了前面的那篇解析3D标签云的文章,作者给出了源码,讲解也比较通俗易懂。大体来说,整个代码分三步:
根据标签的数量,算出每个标签在球面上分布的x,y,z坐标
根据标签的坐标,将标签绘制出来,x,y坐标通过标签的位置来表示,z坐标通