Iris species visualization

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>Tutorial 2 D3</title>
  <style>
    .axis line, .axis path{
      fill: none;
      stroke: black;
      shape-rendering: crispEdges;
    }

.axis text{
      font-family: sans-serif;
      font-size: 10px;
    }
  </style>
	<script src="https://d3js.org/d3.v4.min.js"></script>
</head>
<body>
	<script type="text/javascript">
		var dataset;

var w = 760;
		var h = 400;
		var padding = 0;

var margin = {top: 50, right: 30, bottom: 30, left: 50};
		var width = w - margin.right - margin.left;
		var height = h - margin.top - margin.bottom;

var svg = d3.select("body")
					.append("svg")
					.attr("width", w)
					.attr("height", h)
					.append("g")
					.attr("transform", "translate(" + margin.left +", " + margin.top + ")");

d3.csv("iris.csv", function(data){
			dataset = data;
			console.log(dataset);

var xScale = d3.scaleLinear()
							.domain([0, d3.max(dataset, function(d){ return d.petal_length; })])
							.range([0, width]);
			var yScale = d3.scaleLinear()
							.domain([0, d3.max(dataset, function(d){ return d.petal_width; })])
							.range([height, 0]);

var xAxis = d3.axisBottom(xScale);
			var yAxis = d3.axisLeft(yScale);

svg.append("g")
				.attr("class", "axis")
				.call(yAxis);

svg.append("g")
				.attr("class", "axis")
				.attr("transform", "translate(0, " + height + ")")
				.call(xAxis);

https://d3js.org/d3.v4.min.js