JSFiddle - React, Tailwind, and code Playground

by danzkusuma

HTML

<link rel="stylesheet" href="http://www.flotcharts.org/flot/examples/examples.css">
<script src="http://www.flotcharts.org/flot/jquery.flot.js"></script>
<script src="http://curvedlines.michaelzinsmaier.de/js/flot/curvedLines.js"></script>
	

<div class="demo-container">
			<div id="placeholder" class="demo-placeholder"></div>
		</div>

JavaScript

$(function() {
		var d1 = [[0, 0], [2, 5], [4, 7],  [6, 13]];
		var d2 = [[0, 0], [1, 8],  [2, 9],  [5, 13]];
    
        var options = { 
            series: {
                curvedLines: {
                    active: true
                }
            }, 
            xaxis: { 
                min: -10, max: 10
            },
            yaxis: { 
                min:-10, max: 15,
                //transform: function (v) { return -v; },
                //inverseTransform: function (v) { return -v; }
            }
        };
        
		$.plot("#placeholder", [{data: d1, lines: { show: true, lineWidth: 3}, curvedLines: {apply:true}}, {data: d1,  points: { show: true }}], options);
	});