JSFiddle - React, Tailwind, and code Playground
by amcharts
HTML
<script src="//cdn.amcharts.com/lib/4/core.js"></script>
<script src="//cdn.amcharts.com/lib/4/charts.js"></script>
<script src="//cdn.amcharts.com/lib/4/themes/animated.js"></script>
<div id="chartdiv" style="height: 288px; overflow: hidden;"></div>
JavaScript
am4core.useTheme(am4themes_animated);
// Create chart instance
let chart = am4core.create("chartdiv", am4charts.XYChart);
chart.data = [
{date: "2020-07-01T11:07:00Z", totalEquity: 100},
{date: "2020-07-14T11:07:00Z", totalEquity: 256},
{date: "2020-07-21T11:07:00Z", totalEquity: 350},
{date: "2020-08-04T11:07:00Z", totalEquity: 277},
{date: "2020-08-10T11:07:00Z", totalEquity: 300},
{date: "2020-08-25T11:07:00Z", totalEquity: 556},
{date: "2020-08-27T11:07:00Z", totalEquity: 685},
{date: "2020-08-30T11:07:00Z", totalEquity: 240},
{date: "2020-09-03T11:07:00Z", totalEquity: 367},
{date: "2020-09-07T11:07:00Z", totalEquity: 440},
{date: "2020-09-12T11:07:00Z", totalEquity: 321},
{date: "2020-09-15T11:07:00Z", totalEquity: 576},
{date: "2020-09-17T11:07:00Z", totalEquity: 756},
{date: "2020-09-19T11:07:00Z", totalEquity: 715},
{date: "2020-09-29T11:07:00Z", totalEquity: 1770},
{date: "2020-10-01T11:07:00Z", totalEquity: 1890},
{date: "2020-10-04T11:07:00Z", totalEquity: 1200},
{date: "2020-10-08T11:07:00Z", totalEquity: 1178},
{date: "2020-10-14T11:07:00Z", totalEquity: 1290},
{date: "2020-10-15T11:07:00Z", totalEquity: 1678},
{date: "2020-10-21T11:07:00Z", totalEquity: 1970},
{date: "2020-10-31T11:07:00Z", totalEquity: 2978}
];
// initialization
const minValue = Math.min(...chart.data.map(el => el.totalEquity));
const valueAxis = addValueAxis(chart, minValue);
const dateAxis = setDateAxis(chart);
const series = setSeries(chart);
setRange(series, valueAxis, minValue);
addBullets(series);
addCursor(chart, dateAxis);
setZIndexes(chart);
chart.strokeWidth = 0;
chart.padding(0, 6, 0, 6);
chart.margin(0, 0, 0, 0);
chart.maskBullets = false;
chart.maskRectangle = undefined;
function setDateAxis(chart) {
const dateAxis = chart.xAxes.push(new am4charts.DateAxis());
dateAxis.renderer.grid.template.disabled = true;
dateAxis.renderer.labels.template.visible = false;
dateAxis.renderer.opposite = true;
configureDateAxisTooltip(dateAxis,...