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.

62 lines
1.3 KiB

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/css/examples.css"/>
<style media="screen">
rect {
transition: height 2s ease-in-out;
}
</style>
<script>
// window.setTimeout(function(){
// document.querySelector('rect').setAttribute('height', '500');
// },1000);
</script>
</head>
<body>
<svg>
<!-- <line x1="0" y1="0" x2="100" y2="100" stroke="purple"/>
<rect x="50" y="20" width="150" height="150" fill="red" stroke="blue"/>
<ellipse cx="200" cy="80" rx="100" ry="50" fill="green"/>
<polyline points="20,20
40,25
60,40
80,120
120,140
200,180" stroke="red" fill="green"/>
<polygon points="200,10 250,190 160,210 0,10" fill="yellow" stroke="black" />
<g transform="translate(50,100) scale(2) rotate(45)">
<circle r="10" cx="-10" cy="0" fill="blue" stroke="red" stroke-width="5"/>
<text>This is text</text>
</g> -->
<path d="
M 20 40
l 20 20
l 10 0
Z" stroke="black" fill="none"/>
<path d="
M 100 100
q 25 50, 50 0
t 50 0
t 25 0
t 50 0
t 100 0
" stroke="black" fill="none"/>
<path d="
M 50 50
c
0 20
20 20
20 0
s
40 20
40 0
"
fill="none" stroke="black"/>
<!-- <rect x="100" y="100" width="100" height="100" fill="grey" stroke="black"/> -->
</svg>
</body>
</html>