xxxxxxxxxx
<html>
<head>
<meta charset="utf-8"/>
<meta http-equiv="Content-Language" content="en" />
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width">
<title>Geologic Time</title>
<link rel="stylesheet" href="timescale.css" />
</head>
<body>
<div id="geoTime"></div>
<form id="go-to-period">
<label for="select-period">Go to time period:</label>
<input type="text" list="time-periods" id="select-period" name="select-period" required/>
<datalist id="time-periods">
</datalist>
<button type="submit">Enter</button>
</form>
<script src="https://d3js.org/d3.v5.js"></script>
<script src="timescale.js"></script>
<script type="text/javascript">
timescale.init("geoTime");
</script>
</body>
</html>
https://d3js.org/d3.v5.js