cubic-1.1.min.js三维饼图和三维柱形图插件

时间:2022-04-04 10:09:11
【文件属性】:
文件名称:cubic-1.1.min.js三维饼图和三维柱形图插件
文件大小:5KB
文件格式:JS
更新时间:2022-04-04 10:09:11
三维 3d js 饼图 柱形图 echarts没有三维饼图,但是有时候又需要在前端绘制三维饼图怎么办?这个时候可以考虑用threejs来实现功能。 三维饼图使用示例: var cubic = new Cubic.PieChart("WebGL-output", { width: 400, height: 300, thickness: 5,//厚度 radius: 30,//半径 colors: [0xffffff, 0xff00ff, 0xffff00, 0x0000ff,0x5F9EA0,0x00FF7F],//颜色数组16进制的数组 data: [12, 13, 5, 50, 23, 54],//数据数组 startAngle: 0,//起始角 background: 0x00ffff,//背景色,16进制数字 opacity: 1, //背景透明度 camera: "perspective" //相机类型,透视投影摄像机('perspective)、正交投影摄像机('orthographic') }); console.log(cubic.getPosition()); console.log(cubic.getRotation()); // cubic.setPosition(0, 20, 0); // cubic.setRotation(0, 0, 0); // cubic.remove(); 三维柱形图使用示例: var cubic = new Cubic.CylinderChart("WebGL-output", { width: 400, height: 300, thickness: 60,//厚度 radius: 15,//半径 rate: 0.4,//百分比 background: 0x00ffff,//背景色,16进制数字 opacity: 1, //背景透明度 topColor: 0x555555,//上部颜色 bottomColor: 0xCC0000,//下部颜色 topOpacity: 0.5,//上部透明度 bottomOpacity: 1,//下部透明度 camera: "orthographic" //相机类型,透视投影摄像机('perspective)、正交投影摄像机('orthographic') }); // cubic.remove();

网友评论