simple scatter plot d3v4

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://d3js.org/d3.v4.min.js"></script>
  <style>
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
  </style>
</head>

<body>
  <script>
   const margin = {top: 50, right: 25, bottom: 25, left: 25};
	const width = 700 - margin.right - margin.left;
	const height = 500 - margin.top	- margin.bottom;

const svg = d3.select('body').append('svg')
		.attr('width', width + margin.right + margin.left)
		.attr('height', height + margin.top + margin.bottom)
		.append('g')
		.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');

// define scales
	const xScale = d3.scaleLinear().domain([1, 10]).range([20, width]);
	const yScale = d3.scaleLinear().domain([0, 35]).range([height, 20]);

// define axes
	const xAxis = d3.axisBottom()
			.scale(xScale)
			.tickValues([1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);
	const yAxis = d3.axisLeft()
			.scale(yScale)
			.ticks(10);
	// draw axies
	svg.append('g').attr('id', 'xAxisG')
    .attr('transofrm', 'translate(500, 500)')
    .call(xAxis);
	svg.append('g').attr('id', 'yAxisG').call(yAxis);

</script>
</body>

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