沒有顯示圖片的圖片

我正在使用此代碼生成圖表，但是當我運行相同時，我的圖片上沒有任何圖像。我測試了IE，Chrome和Firefox的代碼。沒有顯示圖片的圖片

CODE

<!DOCTYPE html> 
<html> 
<body> 
<script src="http://code.highcharts.com/highcharts.js"></script> 
<script src="http://code.highcharts.com/modules/exporting.js"> 
$(function() { 
     $('#container').highcharts({ 
      chart: { 
       type: 'column' 
      }, 
      title: { 
       text: 'Monthly Average Rainfall' 
      }, 
      subtitle: { 
       text: 'Source: WorldClimate.com' 
      }, 
      xAxis: { 
       categories: [ 
        'Jan', 
        'Feb', 
        'Mar', 
        'Apr', 
        'May', 
        'Jun', 
        'Jul', 
        'Aug', 
        'Sep', 
        'Oct', 
        'Nov', 
        'Dec' 
       ] 
      }, 
      yAxis: { 
       min: 0, 
       title: { 
        text: 'Rainfall (mm)' 
       } 
      }, 
      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:.1f} mm</b></td></tr>', 
       footerFormat: '</table>', 
       shared: true, 
       useHTML: true 
      }, 
      plotOptions: { 
       column: { 
        pointPadding: 0.2, 
        borderWidth: 0 
       } 
      }, 
      series: [{ 
       name: 'Tokyo', 
       data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] 

      }, { 
       name: 'New York', 
       data: [83.6, 78.8, 98.5, 93.4, 106.0, 84.5, 105.0, 104.3, 91.2, 83.5, 106.6, 92.3] 

      }, { 
       name: 'London', 
       data: [48.9, 38.8, 39.3, 41.4, 47.0, 48.3, 59.0, 59.6, 52.4, 65.2, 59.3, 51.2] 

      }, { 
       name: 'Berlin', 
       data: [42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4, 60.4, 47.6, 39.1, 46.8, 51.1] 

      }] 
     }); 
    </script> 


<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div> 
<input type = "button" name="submit" value="Generate"> 
<button id="highcharts">Click me</button> 
</body> 
</html>

什麼是錯的代碼？請指導。

來源

2014-04-04 user3496418

您需要關閉});也臨近<script>正確（../exporting.js"> </script>），檢查完整的源代碼

你還需要添加jquery插件。

<!DOCTYPE html> 
<body> 
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> 
<script src="http://code.highcharts.com/highcharts.js"></script> 
<script src="http://code.highcharts.com/modules/exporting.js"> </script> 
<script> 
$(function() { 
     $('#container').highcharts({ 
      chart: { 
       type: 'column' 
      }, 
      title: { 
       text: 'Monthly Average Rainfall' 
      }, 
      subtitle: { 
       text: 'Source: WorldClimate.com' 
      }, 
      xAxis: { 
       categories: [ 
        'Jan', 
        'Feb', 
        'Mar', 
        'Apr', 
        'May', 
        'Jun', 
        'Jul', 
        'Aug', 
        'Sep', 
        'Oct', 
        'Nov', 
        'Dec' 
       ] 
      }, 
      yAxis: { 
       min: 0, 
       title: { 
        text: 'Rainfall (mm)' 
       } 
      }, 
      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:.1f} mm</b></td></tr>', 
       footerFormat: '</table>', 
       shared: true, 
       useHTML: true 
      }, 
      plotOptions: { 
       column: { 
        pointPadding: 0.2, 
        borderWidth: 0 
       } 
      }, 
      series: [{ 
       name: 'Tokyo', 
       data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] 

      }, { 
       name: 'New York', 
       data: [83.6, 78.8, 98.5, 93.4, 106.0, 84.5, 105.0, 104.3, 91.2, 83.5, 106.6, 92.3] 

      }, { 
       name: 'London', 
       data: [48.9, 38.8, 39.3, 41.4, 47.0, 48.3, 59.0, 59.6, 52.4, 65.2, 59.3, 51.2] 

      }, { 
       name: 'Berlin', 
       data: [42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4, 60.4, 47.6, 39.1, 46.8, 51.1] 

      }] 
     }); 
     }); 
    </script> 


<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div> 

</body> 
</html>

這裏是fiddle

來源

2014-04-04 07:27:35

哎我能不能刪除這個按鈕的事，讓圖表顯示每當我去使這一代碼被嵌入腳本的網址是什麼？ – user3496418

是的，你可以刪除按鈕，我只是複製粘貼的想法你會在某個地方使用它。我通過刪除必要的事情來更新答案。 –

嘿，我還有一件事要問..爲xAxis我通過js_array。這裏的問題在於第一個小節沒有從數組中取值。 beofre轉換爲js_array，我的陣列是 - ** [array]（http://pastebin.com/sXSMmYaG）** – user3496418

最後有不完整的js代碼。函數開始（「$（function（）{」）必須以「}）;」完成。你還需要添加jquery插件。

$(function() { 
      $('#container').highcharts({ 
       chart: { 
        type: 'column' 
       }, 
       title: { 
        text: 'Monthly Average Rainfall' 
       }, 
       subtitle: { 
        text: 'Source: WorldClimate.com' 
       }, 
       xAxis: { 
        categories: [ 
         'Jan', 
         'Feb', 
         'Mar', 
         'Apr', 
         'May', 
         'Jun', 
         'Jul', 
         'Aug', 
         'Sep', 
         'Oct', 
         'Nov', 
         'Dec' 
        ] 
       }, 
       yAxis: { 
        min: 0, 
        title: { 
         text: 'Rainfall (mm)' 
        } 
       }, 
       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:.1f} mm</b></td></tr>', 
        footerFormat: '</table>', 
        shared: true, 
        useHTML: true 
       }, 
       plotOptions: { 
        column: { 
         pointPadding: 0.2, 
         borderWidth: 0 
        } 
       }, 
       series: [{ 
        name: 'Tokyo', 
        data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] 

       }, { 
        name: 'New York', 
        data: [83.6, 78.8, 98.5, 93.4, 106.0, 84.5, 105.0, 104.3, 91.2, 83.5, 106.6, 92.3] 

       }, { 
        name: 'London', 
        data: [48.9, 38.8, 39.3, 41.4, 47.0, 48.3, 59.0, 59.6, 52.4, 65.2, 59.3, 51.2] 

       }, { 
        name: 'Berlin', 
        data: [42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4, 60.4, 47.6, 39.1, 46.8, 51.1] 

       }] 
      }); 
      });

嘗試了這一點http://jsfiddle.net/zZ9e2/

來源

2014-04-04 07:24:30

我有一個工作小提琴here。得到它的工作：

包括jQuery的：<script src="//code.jquery.com/jquery-1.9.1.js"></script>
添加缺失：});

來源

2014-04-04 07:25:05 loxxy

沒有顯示圖片的圖片

回答

相關問題