mirror of
https://github.com/seigler/seigler.github.io
synced 2025-07-26 23:06:09 +00:00
⚡ Make Rothkogenerator more paintlike
This commit is contained in:
parent
d2a13b79bd
commit
982c1f6475
1 changed files with 11 additions and 3 deletions
|
@ -10,8 +10,15 @@
|
|||
<feGaussianBlur stdDeviation="2 0" />
|
||||
<feDisplacementMap in2="turbulenceFat" scale="-10"/>
|
||||
</filter>
|
||||
<filter id="paintMaskFilter">
|
||||
<feTurbulence seed="0" type="fractalNoise" baseFrequency="0.02 0.1" numOctaves="4"/>
|
||||
<feColorMatrix type="matrix" values="0.5 0 0 0 0.5 0 0.5 0 0 0.5 0 0 0.5 0 0.5 0 0 0 0 1" />
|
||||
</filter>
|
||||
<mask id="paintMask">
|
||||
<rect x="0" y="0" width="300" height="400" fill="white" filter="url(#paintMaskFilter)"></rect>
|
||||
</mask>
|
||||
</defs>
|
||||
<svg viewBox="0 0 300 400" x="0" y="0" width="300" height="400" id="rects" filter="url(#paint)"></svg>
|
||||
<svg id="rects" viewBox="0 0 300 400" x="0" y="0" width="300" height="400" filter="url(#paint)"></svg>
|
||||
<script type="text/javascript">
|
||||
<![CDATA[
|
||||
function randomHsl() {
|
||||
|
@ -31,7 +38,6 @@
|
|||
color: randomHsl(),
|
||||
height: Math.random(),
|
||||
width: mainWidth + (Math.random() < 0.2 ? Math.random() * 100 - 50 : 0),
|
||||
opacity: 1 - Math.pow(Math.random(), 5),
|
||||
x: null,
|
||||
y: null
|
||||
};
|
||||
|
@ -62,7 +68,9 @@
|
|||
newRect.setAttributeNS(null, 'height', shapes[i].height);
|
||||
newRect.setAttributeNS(null, 'width', shapes[i].width);
|
||||
newRect.setAttributeNS(null, 'fill', shapes[i].color);
|
||||
newRect.setAttributeNS(null, 'opacity', shapes[i].opacity);
|
||||
if (i > 0) {
|
||||
newRect.setAttributeNS(null, 'mask', 'url(#paintMask)');
|
||||
}
|
||||
domRects.appendChild(newRect);
|
||||
}
|
||||
]]>
|
||||
|
|
Before Width: | Height: | Size: 3 KiB After Width: | Height: | Size: 3.4 KiB |
Loading…
Add table
Add a link
Reference in a new issue