JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://bitbucket.org/cleonello/jqplot/raw/0d4d1a4fe522/src/jquery.jqplot.css">
<script src="https://bitbucket.org/cleonello/jqplot/raw/0d4d1a4fe522/src/jquery.jqplot.js"></script>
<script src="https://bitbucket.org/cleonello/jqplot/raw/0d4d1a4fe522/src/plugins/jqplot.highlighter.js"></script>
<script src="https://bitbucket.org/cleonello/jqplot/raw/0d4d1a4fe522/src/plugins/jqplot.dateAxisRenderer.js"></script>
<div id="analyse-bottom-left"></div>
JavaScript
$(document).ready(function(){
var line1 = [['2008-09-30',4], ['2008-10-01',6.5], ['2008-10-02',5.7], ['2008-10-03',9], ['2008-10-04',8.2]],
plot = $.jqplot("analyse-bottom-left",[line1],{
highlighter: { show: true, tooltipAxes: 'both' },
seriesDefaults:{
//renderer:$.jqplot.BarRenderer,
rendererOptions: {fillToZero: true},
},
axesDefaults:{
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
},
legend: {
show: true,
placement: 'outsideGrid'
},
//series:seriesNames,
axes:{
xaxis:{
renderer: $.jqplot.DateAxisRenderer,
//ticks:xValues,
tickOptions:{
//angle:30,
formatString:'%Y-%m-%d'
},
tickInterval:'2 days',
min: line1[0][0]
},
yaxis:{
tickOptions: {formatString: 'ÂŁ%d'}
}
}
});
});