无插件的词云浮动效果。

无插件的词云浮动效果。怎么样把这个的代码ts改成vue2可以用的?
https://blog.csdn.net/weixin_43254676/article/details/125483236?ops_request_misc=&request_id=8e524d2a0c434354912f0568e48d06b5&biz_id=&utm_medium=distribute.pc_search_result.none-task-blog-

看了一下代码,基本可以直接用。 如果你是 js语法。那就 把 ts转换成js 。把类型声明去掉即可 ,private 去掉 。该改 var ,let,const看情况而定。

// 定义私有变量
var wordData = [
   '高新企业',
   '100.9万',
   '怀柔区国家',
   '一核四区',
   '实验室挂牌',
   '高新企业',
   '企业入驻',
   '一核四区',
];
var colorList = [
   '#FF7866',
   '#5DEC6B',
   '#ff646f',
   '#00F6FF',
   '#2eccff',
   '#E2CE22',
   '#0090FF',
   '#1BDA87',
];
var contentEle = [];
var direction = '-1';
var speed = 1000;
var width = 360;
var height = 200;
// 初始化函数
function init() {
   var RADIUSX = (width - 50) / 2;
   var RADIUSY = (height - 50) / 2;
   contentEle = [];
   for (var i = 0; i < wordData.length; i += 1) {
     var k = -1 + (2 * (i + 1) - 1) / wordData.length;
     var a = Math.acos(k);
     var b = a * Math.sqrt(wordData.length * Math.PI);
     var x = RADIUSX * Math.sin(a) * Math.cos(b);
     var y = RADIUSY * Math.sin(a) * Math.sin(b);
     var z = RADIUSX * Math.cos(a);
     var singleEle = {
       x: x,
       y: y,
       z: z,
       style: {},
     };
     contentEle.push(singleEle);
   }
   animate();
}
// 动画函数
function animate() {
   rotateX();
   rotateY();
   move();
   window.requestAnimationFrame(animate);
}
// 绕X轴旋转
function rotateX() {
   var angleX = ['-1', '1'].includes(direction)
     ? Math.PI / Infinity
     : Math.PI / ((Number(direction) / 2) * Number(speed));
   var cos = Math.cos(angleX);
   var sin = Math.sin(angleX);
   contentEle = contentEle.map(function(t) {
     var y1 = t.y * cos - t.z * sin;
     var z1 = t.z * cos + t.y * sin;
     return {
       x: t.x,
       y: y1,
       z: z1,
       style: t.style,
     };
   });
}
// 绕Y轴旋转
function rotateY() {
   var angleY = ['-2', '2'].includes(direction)
     ? Math.PI / Infinity
     : Math.PI / (Number(direction) * Number(speed));
   var cos = Math.cos(angleY);
   var sin = Math.sin(angleY);
   contentEle = contentEle.map(function(t) {
     var x1 = t.x * cos - t.z * sin;
     var z1 = t.z * cos + t.x * sin;
     return {
       x: x1,
       y: t.y,
       z: z1,
       style: t.style,
     };
   });
}
// 移动函数
function move() {
   var CX = width / 2;
   var CY = height / 2;
   contentEle = contentEle.map(function(singleEle) {
     var x = singleEle.x;
     var y = singleEle.y;
     var z = singleEle.z;
     var fallLength = 500;
     var RADIUS = (width - 50) / 2;
     var scale = fallLength / (fallLength - z);
     var alpha = (z + RADIUS) / (2 * RADIUS);
     var left = x + CX - 15 + 'px';
     var top = y + CY - 15 + 'px';
     var transform = 'translate(' + left + ', ' + top + ') scale(' + scale + ')';
     var style = {
       opacity: alpha + 0.5,
       zIndex: parseInt(String(scale * 100), 10),
       transform: transform,
     };
     return {
       x: x,
       y: y,
       z: z,
       style: style,
     };
   });
}
// 初始化
init();