<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Flot Examples: Pie Charts</title> <link href="../examples.css" rel="stylesheet" type="text/css"> <style type="text/css"> .demo-container { position: relative; height: 400px; } #placeholder { 550px; } #menu { position: absolute; top: 20px; left: 625px; bottom: 20px; right: 20px; 200px; } </style> <!--[if lte IE 8]><script language="javascript" type="text/javascript" src="../../excanvas.min.js"></script><![endif]--> <script language="javascript" type="text/javascript" src="../../jquery-1.6.4.min.js"></script> <script language="javascript" type="text/javascript" src="../../jquery.flot.js"></script> <script language="javascript" type="text/javascript" src="../../jquery.flot.pie.js"></script> <script type="text/javascript"> $(function() { paint(); }); function paint() { series = 2; var data = [ {label: "one", data: 1, color: "#005CDE" }, { label: "two", data: 2, color: "#00A36A" }, ]; var placeholder = $("#placeholder"); //placeholder.unbind(); $("#title").text("Pie"); $.plot(placeholder, data, { series: { pie: { show: true, combine: { color: "#999", threshold: 0.05 } } }, legend: { show: false } }); } </script> </head> <body> <div id="header"> <h2>Pie</h2> </div> <div id="content"> <h3 id="title"></h3> <div class="demo-container" left = "0px"> <div id="placeholder" class="demo-placeholder"></div> </div> </body> </html>