JSFiddle - React, Tailwind, and code Playground

by godhong

HTML

<script src="https://bitbucket.org/cleonello/jqplot/raw/dd65cd032132/src/jquery.jqplot.js"></script>
<script src="https://bitbucket.org/cleonello/jqplot/raw/dd65cd032132/src/plugins/jqplot.barRenderer.js"></script>
<script src="https://bitbucket.org/cleonello/jqplot/raw/dd65cd032132/src/plugins/jqplot.categoryAxisRenderer.js"></script>
<div id="chart1" style="margin-top:20px; margin-left:20px; width:300px; height:300px; -moz-user-select: -moz-none;-khtml-user-select: none;-webkit-user-select: none;-ms-user-select: none;user-select: none;"></div>

JavaScript

$(document).ready(function(){
        $.jqplot.config.enablePlugins = true;
        var s1 = [2, 6, 7, 10];
        var ticks = ['a', 'b', 'c', 'd'];
        
        plot1 = $.jqplot('chart1', [s1], {
      
            seriesDefaults:{
                renderer:$.jqplot.BarRenderer
            },
            axes: {
                xaxis: {
                    renderer: $.jqplot.CategoryAxisRenderer,
                    ticks: ticks
                }
            }
        });
    
        $('#chart1').bind('jqplotDblClick', 
            function (ev, seriesIndex, pointIndex, data) {
                alert('hi');
            });
});