Skip to content

Instantly share code, notes, and snippets.

@emeeks

emeeks/index.html

Last active August 29, 2015 14:09
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save emeeks/9d615418c71132129f20 to your computer and use it in GitHub Desktop.
Save emeeks/9d615418c71132129f20 to your computer and use it in GitHub Desktop.
Download ZIP
Ch. 1, Fig. 18 - D3.js in Action
Raw
readme.md

This is the code for Chapter 1, Figure 18 from D3.js in Action showing different types of SVG elements.

Note that there is no D3 code or other JavaScript in this example, just vanilla SVG.

Raw
index.html
<html>
<head>
<title>D3 in Action Chapter 1 - Example 1</title>
<meta charset="utf-8" />
</head>
<style>
svg {
position: absolute;
width: 500px;
height: 500px;
border: 1px lightgray solid;
}
</style>
<body>
<div id="vizcontainer">
<svg>
<path d="M 10,60 40,30 50,50 60,30 70,80" style="fill:black;stroke:gray;stroke-width:4px;" />
<polygon style="fill:gray;" points="80,400 120,400 160,440 120,480 60,460" />
<g>
<circle cy="100" cx="200" r="30"/>
<rect x="410" y="200" width="100" height="50" style="fill:pink;stroke:black;stroke-width:1px;" />
</g>
</svg>
</div>
</body>
<footer>
<script>
</script>
</footer>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment