-
Notifications
You must be signed in to change notification settings - Fork 52
/
09_ifs_barnsley.html
116 lines (105 loc) · 3.69 KB
/
09_ifs_barnsley.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Cindy JS</title>
<script type="text/javascript" src="../../build/js/Cindy.js"></script>
<script type="text/javascript" src="../../build/js/CindyGL.js"></script>
<style type="text/css">
* {
border: 0;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<script id="csinit" type="text/x-cindyscript">
use("CindyGL");
L = (-3, -1); R = (4, -1);
createimage("ifs", 400, 800);
colorplot("ifs", [0, 0, 0]);
an = true;
d = 1.01;
s = .1;
drawstep() := (
w1=map(A1, B1, C1, A0, B0, C0);
w2=map(A2, B2, C2, A0, B0, C0);
w3=map(A3, B3, C3, A0, B0, C0);
w4=map(A4, B4, C4, A0, B0, C0);
colorplot("ifs",
d*(
imagergb("ifs", w1*[#.x, #.y, 1]) +
imagergb("ifs", w2*[#.x, #.y, 1]) +
imagergb("ifs", w3*[#.x, #.y, 1]) +
imagergb("ifs", w4*[#.x, #.y, 1])
) +
([1,0,0]*exp(-|#,A0|) +
[0,1,0]*exp(-|#,B0|) +
[0,.2,.7]*exp(-|#,C0|))*s
);
);
al = .1;
</script>
<script id="csmove" type="text/x-cindyscript">
A0 = A;
B0 = B;
C0 = C+[cos(seconds()),sin(seconds())]/3;
C2 = C0;
C3 = A;
C4 = B;
</script>
<script id="cskeydown" type="text/x-cindyscript">
print("pressed key" + keycode());
if(keycode()==32, colorplot("ifs", [1,0,0,1])); //space -> red
if(keycode()==82, an = !an); //R -> start/stop animation
if(keycode()==83, drawstep()); //S -> step
if(keycode()==84, if(al>.1, al = 0, al = .5)); //T -> toggle triangles
if(keycode()==73, colorplot((-10,-10), (10,-10), "ifs", if(abs(#)<10, [0,0,1,1], [0,0,0,0]))); //I -> Image
drawimage(L, R, "ifs");
</script>
<script id="csdraw" type="text/x-cindyscript">
if(an,
drawstep();
);
drawimage(L, R, "ifs");
draw(C0, color->red(1), size->5);
fillpoly([A1, B1, C1], color->[.2,.2,.8], alpha->al);
fillpoly([A2, B2, C2], color->[.2,.2,.8], alpha->al);
fillpoly([A3, B3, C3], color->[.2,.2,.8], alpha->al);
fillpoly([A4, B4, C4], color->[.2,.2,.8], alpha->al);
fillpoly([A0, B0, C0], color->[1,.2,.3], alpha->al);
</script>
<div id="CSCanvas" style="border:2px solid black"></div>
<script type="text/javascript">
var gslp=[
{ name: "A", type: "Free", pos: [-2.064, 4.404]},
{ name: "A1", type: "Free", pos: [-0.0206, 0.7046]},
{ name: "A2", type: "Free", pos: [-1.5782, 5.426]},
{ name: "A3", type: "Free", pos: [-1.5578, 2.0942]},
{ name: "A4", type: "Free", pos: [1.5427, 0.9603]},
{ name: "B", type: "Free", pos: [2.378, 3.528]},
{ name: "B1", type: "Free", pos: [0.0238, 0.5645]},
{ name: "B2", type: "Free", pos: [2.1624, 4.5037]},
{ name: "B3", type: "Free", pos: [-0.4417, 2.9231]},
{ name: "B4", type: "Free", pos: [0.6311, 1.905]},
{ name: "C", type: "Free", pos: [2.636, 9.974], alpha: 0},
{ name: "C1", type: "Free", pos: [0.0264, 1.5958]},
//{ name: "C2", type: "Free", pos: [2.6396, 9.9725]},
//{ name: "C3", type: "Free", pos: [-2.066, 4.4006]},
//{ name: "C4", type: "Free", pos: [2.3973, 3.5191]},
];
cdy = CindyJS({canvasname:"CSCanvas",
scripts: "cs*",
geometry:gslp,
animation: {autoplay: true},
ports: [{
id: "CSCanvas",
width: 400,
height: 800,
transform: [ { visibleRect: [-3, -1, 4, 13] } ]
}]
});
</script>
</body>
</html>