TweenMax+svg实现贝塞尔曲线动画图表效果代码

代码语言:html

所属分类:动画

代码描述:TweenMax+svg实现贝塞尔曲线动画图表效果代码

代码标签: TweenMax svg 贝塞尔 曲线 动画 图表

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">

    <style>
        body,
    html {
      margin: 0;
      width: 100%;
      height: 100%;
      position: relative;
      background: #212938;
    }
    
    #parent {
      width: 300px;
      height: 300px;
      position: absolute;
      left: 50%;
      top: 50%;
      -webkit-transform: translate(-50%, -50%) scale(1.5);
    }
    
    .graph-grid {
      opacity: 0.6;
      stroke: #C4CCFC;
      stroke-width: 1;
      stroke-linecap: round;
    }
    
    .graph-lines {
      stroke: #EDBF6E;
      stroke-width: 2;
      stroke-linecap: round;
    }
    
    .graph-points circle,
    .graph-bezier circle {
      /*stroke: #40ACBA;*/
      stroke: #EDBF6E;
      stroke-width: 2;
      fill: #212938;
    }
    
    .graph-bezier line {
      stroke: #ED5E8F;
      stro.........完整代码请登录后点击上方下载按钮下载查看

网友评论0