frederic
/
generative-plotter-thingies
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
11 Commits
1 Branch
0 Tags
564 KiB
Tree: 24f263a2ca
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '24f263a2ca'
${ noResults }
generative-plotter-thingies/lindenmayer-system/lindenmeyer-system.html

244 lines
6.1 KiB
Raw Normal View History Unescape

initial commit
6 years ago
<title>JavaScript <=> PaperScript example</title>
<code mode="text/html">
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="paper.js"></script>
<script type="text/javascript">
var ppp = new paper.Path();
</script>
<script type="text/javascript" src="lindenmeyer-system.js" canvas="canvas"></script>
<script type="text/paperscript" canvas="canvas">
/*
var r = generate('A'.split(''),
[
['A'.split(''), 'AB'.split('')],
//['x'.split(''), 'X'.split('')],
//['B'.split(''), 'C'.split('')]
['B'.split(''), 'A'.split('')]
]
, 4);
*/
/************************************************
* Dragon Curve
************************************************/
function dragon_curve(variant) {
project.clear();
var r = generate(
'FX'.split(''),
[
['X'.split(''), 'X+YF+'.split('')],
['Y'.split(''), '-FX-Y'.split('')]
],
12
);
if(variant == 'random-angles') {
var actions = {
'F': draw_forward(),
'-': draw_turn(-Math.PI/2.23+Math.random()),
'+': draw_turn(Math.PI/2.42+Math.random())
};
} else {
var actions = {
'F': draw_forward(),
'-': draw_turn(-Math.PI/2),
'+': draw_turn(Math.PI/2),
};
}
var p = draw(r, actions);
if(variant == 'random-angles') {
p.scale(4);
} else {
p.scale(3);
}
p.translate(new Point(200, 200));
p.strokeWidth = 1;
p.strokeColor = '#ff00ff';
}
/************************************************
* Sierpinski Triangle
************************************************/
function sierpinski2(num_defects) {
project.clear();
if(typeof num_defects == 'undefined') { num_defects = 0 };
var r = generate(
'IA'.split(''),
[
['A'.split(''), 'B-A-B'.split('')],
['B'.split(''), 'A+B+A'.split('')]
],
8
);
for(var i=0; i<num_defects; i++) {
r[Math.floor(Math.random()*r.length)] = '*';
}
var actions = {
'A': draw_forward(),
'B': draw_forward(),
'I': draw_angle_init(Math.PI/3),
'-': draw_angle_turn(-1),
'+': draw_angle_turn(1),
'*': draw_angle_add(0.001),
};
var p = draw(r, actions);
p.scale(1.5);
p.translate(new Point(150, 150));
p.strokeWidth = 1;
p.strokeColor = '#ff00ff';
}
/************************************************
* Sierpinski Triangle
************************************************/
function sierpinski() {
project.clear();
var r = generate(
'IF-G-G'.split(''),
[
['F'.split(''), 'F-G+F+G-F'.split('')],
['G'.split(''), 'GG'.split('')]
],
6
);
var p = draw(
r,
{
'F': draw_forward(),
'G': draw_forward(),
'I': draw_angle_init(2*Math.PI/3),
'-': draw_angle_turn(-1),
'+': draw_angle_turn(1),
}
);
p.scale(5);
p.translate(new Point(200, 200));
p.strokeWidth = 1;
p.strokeColor = '#ff00ff';
}
add barnsley fern
6 years ago
/************************************************
* Barnsley Fern
************************************************/
function barnsley_fern() {
project.clear();
var r = generate(
'IXF'.split(''),
[
['X'.split(''), 'F+[[X]-X]-F[-FX]+X'.split('')],
['F'.split(''), 'FF'.split('')]
],
6
);
console.log(r);
var p = draw(
r,
{
'F': draw_forward(),
'I': draw_angle_init(25/180 * Math.PI),
'-': draw_angle_turn(-1),
'+': draw_angle_turn(1),
'[': draw_state_push(),
']': draw_state_pop()
}
);
p.scale(2);
p.translate(new Point(200, 200));
p.strokeWidth = 1;
p.strokeColor = '#ff00ff';
}
initial commit
6 years ago
/************************************************
*
************************************************/
globals.dragon_curve = dragon_curve;
globals.sierpinski2 = sierpinski2;
globals.sierpinski = sierpinski;
add barnsley fern
6 years ago
globals.barnsley_fern = barnsley_fern;
initial commit
6 years ago
globals.get_svg = function() {
return project.exportSVG({asString: true});
}
</script>
<script type="text/javascript">
//document.addEventListener('DOMContentLoaded', function() {
window.globals = {}
window.onload = function() {
/*
draw();
document.getElementById('redraw').addEventListener('click', function() {
draw();
});
*/
paper.install(window);
console.log(window.globals);
document.getElementById('download-svg').addEventListener('click', function() {
var svgdata = 'data:image/svg+xml;utf8,' + encodeURIComponent(window.globals.get_svg());
var a = document.createElement('a');
a.download = 'export.svg';
a.href = svgdata;
document.body.appendChild(a);
a.click();
});
document.getElementById('dragon-curve').addEventListener('click', function() {
window.globals.dragon_curve();
});
document.getElementById('dragon-curve-random-angles').addEventListener('click', function() {
window.globals.dragon_curve('random-angles');
});
document.getElementById('sierpinski2').addEventListener('click', function() {
window.globals.sierpinski2(0);
});
document.getElementById('sierpinski2-defects').addEventListener('click', function() {
window.globals.sierpinski2(10);
});
document.getElementById('sierpinski').addEventListener('click', function() {
window.globals.sierpinski();
});
add barnsley fern
6 years ago
document.getElementById('barnsley_fern').addEventListener('click', function() {
window.globals.barnsley_fern();
});
initial commit
6 years ago
}
</script>
</head>
<body>
<button id="download-svg">download svg</button>
<button id="dragon-curve">dragon curve</button>
<button id="dragon-curve-random-angles">dragon curve (random angles)</button>
<button id="sierpinski2">sierpinski2</button>
<button id="sierpinski2-defects">sierpinski2 (random defects)</button>
<button id="sierpinski">sierpinski</button>
add barnsley fern
6 years ago
<button id="barnsley_fern">barnsley_fern</button>
initial commit
6 years ago
<hr>
<canvas id="canvas" style="width: 500px; height: 500px;" resize></canvas>
</body>
</html>