D3 Examples - Scatter1_HTML

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
​
<head>
<meta charset="utf-8">
<title>First Scatter Plot Using HTML!</title>
  
<style>
        /* 5) Set `circle` elements to have a "fill" of "purple" or whatever color you choose */
circle {
  fill: purple;
}
svg {
  border: 1px solid #f0f;
}
</style>
</head>
​
<body>
<!-- 1) Make a container `<div>` in which you'll render your content -->
​
<!-- 2) Create a `<p>` element in which you write "My HTML Scatter" -->
​
<!-- 3) Make a container `<svg>` element in which you'll place your circles -->
<!-- Set your svg's `width` to 300, and `height` to `400` -->
​
<!-- 4) Put 3 `<circle>` inside of your `<svg>`,
setting the properties for each one: -->
<!-- 
- `cx`: How far to move the circle in the `x` direction (right). Should be 100, 150, and 200. 
- `cy`: How for to move the circle in the `y` direction (down from the top). Should be 100, 150, and 200. 
- 'r': circle's radius. Should be 10, 15, and 20.
-->
</body>
​
</html>
    