js实现canvas L-system植物生长绘制效果代码

代码语言:html

所属分类:其他

代码描述:js实现canvas L-system植物生长绘制效果代码

代码标签: L-system 植物 生长 绘制 效果

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

<!doctype html>
<html  lang="en-us">
<head>
	<meta charset="utf-8">

</head>
<body>


<div class="center">
	<article>
		<div class="social">
    
</div>
		<h1 class="title">L-System</h1>
		

		<div class="content"><div>
  <p>Experimenting with Linden Meyer Systems.</p>
<style>
    .post {
        max-width: none;
        width: 800px;
        padding: 0;
    }
</style>
<p><canvas id="canvas"></canvas></p>
<script>
// canvas setup
var d=document,
    canvas = document.getElementById("canvas"),
    c=canvas,
    W=800,H=700;
    c.width = W,
    c.height = H,
    c = c.getContext("2d");

// Math function aliases
var cos  = Math.cos,
    sin  = Math.sin,
    abs  = Math.abs,
    sqrt = Math.sqrt,
    sgn  = function(val) { return val >= 0 ? 1 : -1 },
    atan2= Math.atan2,
    rand = Math.random,
    TAU = 2*Math.PI;

// logging
dolog = true;

function logCreate(mod){
    var i = 0;
    return function(){
        if( !dolog ) return;
        if( i % mod == 0 )
            console.log(arguments);
        i = (i + 1) % mod;
    }
}

log  = logCreate(1);
logS = logCreate(60);

// Mouse
$M = {
    loc  : V2(W/2, H/2),
    dloc : V2(0,0),
    uloc : V2(0,0),
    down : false,
    action : 0,
    pressed : false
};

function V2(x,y){
    return {x : x || 0.0, y:y || 0.0};
}

V2c = function( v ){
    return { x : v.x, y : v.y };
}

V2add = function( a, b, r ){
    r.x = a.x + b.x;
    r.y = a.y + b.y;
}

V2sub = function( a, b, r ){
    r.x = a.x - b.x;
    r.y = a.y - b.y;
}

V2scale = function( a, s, r ){
    c.x = a.x * s;
    c.y = a.y * s;
}

V2dot = function( a, b, r ){
    r.x = a.x * b.x;
    r.y = a.y * b.y;
}

V2rot = function( a, angle, r ){
    r.x = a.x * cos( angle ) - a.y * sin( angle );
    r.y = a.y * sin( angle ) + a.y * cos( angle );
}

RotM2 = function( angle ){
    return {
        x11 : cos( angle ), x12 : -sin( angle ),
        x21 : sin( angle ), x22 :  cos( angle ) 
    };
}

M2xV2 = function( m, v, r ){
    r.x = v.x * m.x11 + v.y * m.x12;
    r.y = v.x * m.x21 + v.y * m.x22;
}

MAX = 1000000;

leaf = {
    axiom : "X",
    rules : {
        "F" : "FF",
        "X" : "F-[[X]+X]+F[+FX]-X"
    }
}

raceme = {
    axiom : "X",
    rules : {
        "F" : "FF",
        "X" : "F-[[F]+F]+F-FX"
    },
    commands : {
 .........完整代码请登录后点击上方下载按钮下载查看

网友评论0