JSFiddle - React, Tailwind, and code Playground
HTML
<script language="javascript" type="text/javascript" src="https://bitbucket.org/cleonello/jqplot/raw/b5a7796a9ebf/src/jquery.jqplot.js"></script>
<script language="javascript" type="text/javascript" src="https://bitbucket.org/cleonello/jqplot/raw/b5a7796a9ebf/src/plugins/jqplot.cursor.js"></script>
<script language="javascript" type="text/javascript" src="https://bitbucket.org/cleonello/jqplot/raw/b5a7796a9ebf/src/plugins/jqplot.highlighter.js"></script>
<script language="javascript" type="text/javascript" src="https://bitbucket.org/cleonello/jqplot/raw/b5a7796a9ebf/src/plugins/jqplot.categoryAxisRenderer.js"></script>
<script language="javascript" type="text/javascript" src="https://bitbucket.org/cleonello/jqplot/raw/b5a7796a9ebf/src/plugins/jqplot.canvasAxisTickRenderer.js"></script>
<script language="javascript" type="text/javascript" src="https://bitbucket.org/cleonello/jqplot/raw/b5a7796a9ebf/src/plugins/jqplot.canvasTextRenderer.js"></script>
<script language="javascript" type="text/javascript" src="https://bitbucket.org/cleonello/jqplot/raw/b5a7796a9ebf/src/plugins/jqplot.canvasAxisLabelRenderer.js"></script>
<script language="javascript" type="text/javascript" src="https://bitbucket.org/cleonello/jqplot/raw/b5a7796a9ebf/src/plugins/jqplot.pointLabels.js"></script>
<script language="javascript" type="text/javascript" src="https://bitbucket.org/cleonello/jqplot/raw/b5a7796a9ebf/src/plugins/jqplot.barRenderer.js"></script>
<div id="thema1chart"></div>
JavaScript
$(document).ready(function() {
var x1 = [[1,1]];
var x2 = [[2,1]];
var x3 = [[4,1]];
var x4 = [[8,1]];
var x5 = [[16,1]];
var x6 = [[1,0.5],[1,1.5]];
var plot2 = $.jqplot('thema1chart', [x1, x2, x3, x4, x5, x6], {
stackSeries: true,
seriesDefaults: {
renderer: $.jqplot.BarRenderer,
rendererOptions: {
barDirection: 'horizontal'
},
pointLabels: {
show: false,
stackedValue: true
}
},
series: [{shadow: false, color:'#666666'},
{shadow: false, color:'#FFFFFF'},{shadow: false, color:'#b4d2dd'},{shadow: false, color:'#FFFFFF'},{shadow: false, color:'#666666'},
{
shadow: false,
disableStack : true,//otherwise it wil be added to values of previous series
renderer: $.jqplot.LineRenderer,
lineWidth: 2,
label:'Benchmark',
color:'#666666',
showLine:false,
pointLabels: {
show: false
},
markerOptions: {
size: 7, style:"plus"
}}],
axes: {
yaxis: {
renderer: $.jqplot.CategoryAxisRenderer
}
,
yaxis: {
autoscale: true
}
}
});
});