javascript - jquery Donut Pie graph not displaying page -
i trying display jquery donut pie graph in html
and implemented in page
<!doctype html> <!-- change license header, choose license headers in project properties. change template file, choose tools | templates , open template in editor. --> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div> <script> $(function () { // create chart chart = new highcharts.chart({ chart: { renderto: 'container', type: 'pie' }, title: { text: 'browser market share, april, 2011' }, yaxis: { title: { text: 'total percent market share' } }, plotoptions: { pie: { shadow: false } }, tooltip: { formatter: function () { return '<b>' + this.point.name + '</b>: ' + this.y + ' %'; } }, series: [{ name: 'browsers', data: [["firefox", 6], ["msie", 4], ["chrome", 7], ["opera", 7]], size: '60%', innersize: '20%', showinlegend: true, datalabels: { enabled: false } }] }); }); </script> <script src="http://code.highcharts.com/highcharts.js"></script> <script src="http://code.highcharts.com/modules/exporting.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> </body> </html> and when run page nothing shown in page blank page
when check browser console see following error
uncaught referenceerror: $ not defined(anonymous function) @ donut_pie+two.php:18 highcharts.js:306 uncaught typeerror: cannot read property 'addevent' of undefined(anonymous function) @ highcharts.js:306(anonymous function) @ highcharts.js:308(anonymous function) @ highcharts.js:324 exporting.js:9 uncaught typeerror: cannot read property 'fireevent' of undefined(anonymous function) @ exporting.js:9(anonymous function) @ exporting.js:23 can me what's wrong in this
place
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> befor <script></script> tag
like
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script> $(function () { // create chart chart = new highcharts.chart({ chart: { renderto: 'container', type: 'pie' }, title: { text: 'browser market share, april, 2011' }, yaxis: { title: { text: 'total percent market share' } }, plotoptions: { pie: { shadow: false } }, tooltip: { formatter: function () { return '<b>' + this.point.name + '</b>: ' + this.y + ' %'; } }, series: [{ name: 'browsers', data: [["firefox", 6], ["msie", 4], ["chrome", 7], ["opera", 7]], size: '60%', innersize: '20%', showinlegend: true, datalabels: { enabled: false } }] }); }); </script> <script src="http://code.highcharts.com/highcharts.js"></script> <script src="http://code.highcharts.com/modules/exporting.js"></script>
Comments
Post a Comment