JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.3/jquery.flot.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.1.135/jspdf.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.3/jquery.flot.canvas.min.js"></script>
<div>
    <button id="btnGetPdf">Get PDF</button>
</div>
<div id="placeholder"></div>

CSS

#placeholder {
	width: 600px;
	height: 300px;
}

JavaScript

var graphOptions = { xaxis:{ min: 0, max: 600, tickSize: 50 }, yaxis:{ min: -1, max: 11, tickSize: 2 }, series:{ lines: {show: true} }, grid:{ borderWidth: 1, backgroundColor: "white" }};

plot = $.plot($("#placeholder"), [ [[0, 4],[100, 2],[200, 6],[300, 10],[400, 1],[500, 0],[600, 5]] ], graphOptions);


$("#btnGetPdf").on("click", function btnGetPdf () {
	var canvas = plot.getCanvas();
	var src = canvas.toDataURL("image/png");
	var doc = new jsPDF('landscape');
	doc.addImage(src, 'PNG', 10, 20, 280, 150);
	//doc.save('testImage.pdf');
    doc.output('dataurlnewwindow');
});