Created
December 4, 2017 12:44
-
-
Save hashrock/6f082d09f8a9073dae1caa07dbd26b6f to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="ja"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<meta http-equiv="X-UA-Compatible" content="ie=edge"> | |
<title>SVG Sandbox</title> | |
<style> | |
body { | |
background: #EEE; | |
} | |
svg { | |
background: #FFF; | |
} | |
line { | |
stroke: #333; | |
stroke-width: 3; | |
} | |
path { | |
stroke: #333; | |
stroke-width: 3; | |
fill: none; | |
} | |
rect { | |
fill: #CCC; | |
stroke: #333; | |
} | |
circle { | |
fill: #CCC; | |
stroke: #333; | |
} | |
</style> | |
</head> | |
<body> | |
<div id="app"> | |
<svg viewbox="0 0 500 400" width="500" height="400"> | |
<rect x=100 y=100 width=20 height=20></rect> | |
<circle cx=200 cy=100 r=20></circle> | |
<text x=300 y=100>test</text> | |
<line x1=100 y1=200 x2=120 y2=220></line> | |
<path d="M 200,200 C 240,200 210,250 250,250"></path> | |
</svg> | |
</div> | |
<script src="https://unpkg.com/[email protected]/dist/vue.js"></script> | |
<script> | |
new Vue({ | |
el: "#app", | |
data: { | |
}, | |
mounted() { | |
}, | |
methods: { | |
} | |
}) | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment