Yin and yang: Difference between revisions
Content added Content deleted
m (→{{header|Rust}}: Direct link to svg file) |
(→{{header|JavaScript}}: add SVG (path evenodd)) |
||
Line 3,222: | Line 3,222: | ||
</html></syntaxhighlight> |
</html></syntaxhighlight> |
||
===SVG (path evenodd)=== |
|||
Run this script from the browser console (F12) or from the <script> tag in the body of the html document. |
|||
<syntaxhighlight lang="javascript">const NS = 'http://www.w3.org/2000/svg'; |
|||
function yinYang(r, x, y, th = 1) { |
|||
const cR = (dY, rad) => `M${x},${y + dY + rad} a${rad},${rad},0,1,1,.1,0z`; |
|||
const arc = (dY, rad, cw = 1) => `A${rad},${rad},0,0,${cw},${x},${y + dY}`; |
|||
const d = cR(0, r + th) + cR(r / 2, r / 6) + cR(-r / 2, r / 6) |
|||
+ `M${x},${y}` + arc(r, r / 2, 0) + arc(-r, r) + arc(0, r / 2); |
|||
const path = document.createElementNS(NS, 'path'); |
|||
path.setAttribute('d', d); |
|||
path.setAttribute('fill-rule', 'evenodd'); |
|||
return path; |
|||
} |
|||
const dialog = document.body.appendChild(document.createElement('dialog')); |
|||
const svg = dialog.appendChild(document.createElementNS(NS, 'svg')); |
|||
svg.setAttribute('width', 170); |
|||
svg.setAttribute('height', 120); |
|||
svg.appendChild(yinYang(50.0, 60, 60)); |
|||
svg.appendChild(yinYang(20.0, 140, 30)); |
|||
dialog.showModal(); |
|||
</syntaxhighlight> |
|||
===Canvas=== |
===Canvas=== |
||
{{trans|Flutter}} |
{{trans|Flutter}} |