zoukankan      html  css  js  c++  java
  • 3D标签云

    一、圆的坐标表达式

    for(var i = 0;i < len;i++){

    degree = (2*(k+1)-1)/len - 1;
    a = Math.acos(degree);//这样取得弧度数生成的点在球体上式均匀分布的
    b = a*Math.sqrt(len*Math.PI);

    x = radiu * Math.sin(a) * Math.cos(b);
    y = radiu * Math.sin(a) * Math.sin(b);
    z = radiu * Math.cos(a);

    label_item[k].style.transform = "translateZ("+z+"px) translateX("+x+"px) translateY("+y+"px)";//设置x,y,z坐标

    }

    //x轴旋转

    //核心代码

     {

    y' = y*cos(θ) - z*sin(θ);

    z' = z*cos(θ) + y*sin(θ);

    }
    function rotateX(elements,degreeX){
    var label_item = elements;
    var degree = degreeX;
    // console.log(getSpeed())
    var cos = Math.cos(degree);
    var sin = Math.sin(degree);
    var x, y,z;
    for(var i = 0;i < label_item.length;i++){
    x = label_item[i].dataset.x;
    y = label_item[i].dataset.y;
    z = label_item[i].dataset.z;
    var y1 = y*cos - z*sin;
    var z1 = z*cos + y*sin;
    label_item[i].dataset.y = y1;
    label_item[i].dataset.z = z1;
    if(label_item[i].dataset.z < 0){
    label_item[i].style.opacity = '0.5';
    label_item[i].style.fontSize = '4px';
    }else{
    label_item[i].style.fontSize = '14px';
    }
    if(z > 0){
    label_item[i].style.opacity = "1";
    }else{
    label_item[i].style.opacity = "0.5";
    }
    label_item[i].style.transform = "translateZ("+z1+"px) translateX("+x+"px) translateY("+y1+"px) rotateX(0deg)";

    }
    }

    //y轴旋转

    //核心代码

    {

    x' = x*cos(θ) - z*sin(θ);

    z' = z*cos(θ) + x*sin(θ);

    }
    function rotateY(elements,degreeY){
    var label_item = elements;
    var degree = degreeY;
    var cos = Math.cos(degree);
    var sin = Math.sin(degree);
    var x, y,z;
    for(var i = 0;i < label_item.length;i++){
    x = label_item[i].dataset.x;
    y = label_item[i].dataset.y;
    z = label_item[i].dataset.z;
    var x1 = x*cos - z*sin;
    var z1 = z*cos + x*sin;
    label_item[i].dataset.x = x1;
    label_item[i].dataset.z = z1;
    if(label_item[i].dataset.z < 0){
    label_item[i].style.opacity = '0.5';
    label_item[i].style.fontSize = '4px';
    }else{
    label_item[i].style.fontSize = '14px';
    }
    if(z > 0){
    label_item[i].style.opacity = "1";
    }else{
    label_item[i].style.opacity = "0.5";
    }
    label_item[i].style.transform = "translateZ("+z1+"px) translateX("+x1+"px) translateY("+y+"px) rotateX(0deg)";

    }

    }

  • 相关阅读:
    ccmenu里的位置
    【luogu P3346】诸神眷顾的幻想乡(广义 SAM)
    Snow的追寻(线段树)(LCA)
    【bzoj 4303】数列 / T4(K-D tree)
    选课 / T3(组合数)(容斥)
    随机游走 / T1(期望)(树形DP)
    【luogu P3898】期望异或 / T3 / 大新闻(数位DP)(数学)
    【luogu P7295】Paint by Letters P(前缀和)(欧拉公式)(bfs)(对偶图)
    【luogu P7294】Minimum Cost Paths P(二分)(单调栈)(斜率)
    【luogu P7293】Sum of Distances P(线段树)(图论)
  • 原文地址:https://www.cnblogs.com/deerfig/p/6730784.html
Copyright © 2011-2022 走看看