zdog实现一个可拖动旋转的树枝树干效果代码

代码语言:html

所属分类:其他

代码描述:zdog实现一个可拖动旋转的树枝树干效果代码

代码标签: zdog 拖动 旋转 树枝 树干

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


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

<head>

 
<meta charset="UTF-8">
 

 
 
<style>
.zdog-canvas {
 
background: #DFF;
}
</style>



</head>

<body>
 
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/zdog.dist.js"></script>
<canvas class="zdog-canvas" width="750" height="750"></canvas>


 
     
<script>
let isSpinning = false;

// create illo
let illo = new Zdog.Illustration({
  // set canvas with selector
  element: '.zdog-canvas',
  dragRotate: true,

  onDragStart: function () {
    isSpinning = false;
  } });


//initialWidth controls size of tree, but larger trees (above 15?) would
//    benefit from a kill branches effect
//branchAngle should be between 8 and 14
//angleLimit looks best between 50 and 100, depending on circumstances
//    consider making angleMin and angleMax separate numbers for lopsided trees
//wiggleMax
//wiggleAmount should be between 6 and 15
function drawTree(initialWidth, branchAngle, angleLimit, wiggleMax, wiggleAmount) {
  let tree = [];
  let branches = [];
  //Initial branch
  branches.push({ x: 0, y: 150, t: 0, w: initialWidth }); //x, y, theta & width

  while (branches.length > 0) {
    branches = branches.concat(processBranch(branches.shift(),.........完整代码请登录后点击上方下载按钮下载查看

网友评论0