javascript - No graph displayed using Highcharts -


i have written following javascript code generate column graph using highcharts, no graph displayed. problem here? checked syntax errors, not find any.

<div id="container1" style="width:100%; height:400px;"></div>  function create_graph() {     var xaxislabels = ['a ', 'b', 'c', 'd', 'e'];     var yaxistitle = 'average';     var xaxistitle = 'xtitle';     var graphtitle= 'title';     var pvalues = [1,2,3,4,5];     var nvalues = [1,3,4,5,7];     chart = new highcharts.chart ({         chart: {              height: 600,              width: 1200,              renderto: container1,              type: 'column'              //reflow: false         },         title: {             text: graphtitle         },         xaxis: {             categories: xaxislabels         },         yaxis: {             min: 0,             title: {                 text: yaxistitle             }         },         tooltip: {             headerformat: '<span style="font-size:10px">{point.key}</span><table>',             pointformat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +                 '<td style="padding:0"><b>{point.y}</b></td></tr>',             footerformat: '</table>',             shared: true,             usehtml: true         },         plotoptions: {             column: {                 pointpadding: 0.2,                 borderwidth: 0             }         },         series: [{             name: 'postives',             data: pvalues         }, {             name: 'negatives',             data: nvalues         }]     }); } create_graph(); 

please let me know if more detail required. keep getting error "it looks post code, please add details."

it's working fine on end:

index.html

<html> <head>   <meta charset="utf-8">   <title>document</title>   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>   <script src="http://code.highcharts.com/highcharts.js"></script> </head> <body>   <div id="container1" style="width:100%; height:400px;"></div>    <script type="text/javascript">     function create_graph() {         var xaxislabels = ['a ', 'b', 'c', 'd', 'e'];         var yaxistitle = 'average';         var xaxistitle = 'xtitle';         var graphtitle= 'title';         var pvalues = [1,2,3,4,5];         var nvalues = [1,3,4,5,7];         chart = new highcharts.chart ({             chart: {                  height: 600,                  width: 1200,                  renderto: 'container1',                  type: 'column'                  //reflow: false             },             title: {                 text: graphtitle             },             xaxis: {                 categories: xaxislabels             },             yaxis: {                 min: 0,                 title: {                     text: yaxistitle                 }             },             tooltip: {                 headerformat: '<span style="font-size:10px">{point.key}</span><table>',                 pointformat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +                     '<td style="padding:0"><b>{point.y}</b></td></tr>',                 footerformat: '</table>',                 shared: true,                 usehtml: true             },             plotoptions: {                 column: {                     pointpadding: 0.2,                     borderwidth: 0                 }             },             series: [{                 name: 'postives',                 data: pvalues             }, {                 name: 'negatives',                 data: nvalues             }]         });     }      create_graph();   </script> </body> </html> 

jsfiddle link


Comments

Popular posts from this blog

c++ - Delete matches in OpenCV (Keypoints and descriptors) -

java - Could not locate OpenAL library -

sorting - opencl Bitonic sort with 64 bits keys -