zdog实现一个可拖动旋转的树枝树干效果代码
代码语言:html
所属分类:其他
代码描述: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