爲什麼不能在我的網站上使用此代碼

我試圖通過插入「原始HTML」函數將此代碼添加到使用sandvox構建的我的網站中。一旦我添加了代碼，我只能在我的網站上看到一個空白框。我希望有一些方法可以得到一些幫助。感謝您的任何幫助。爲什麼不能在我的網站上使用此代碼

前highcharts JS

<html> 
<script src="http://code.highcharts.com/highcharts.js"></script> 
<script src="http://code.highcharts.com/modules/exporting.js"></script> 
<script src="http://code.jquery.com/jquery-2.1.3.min.js"></script> 


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

<script> 
$(function() { 
    $('#container').highcharts({ 
     chart: { 
      type: 'column' 
     }, 
     title: { 
      text: 'Prevalence of Performance Enhancing Drug Use By Sport' 
     }, 
     subtitle: { 
      text: 'Source: <a href="http://www.samuelwbennett.com">getfast</a>' 
     }, 
     xAxis: { 
      type: 'category', 
      labels: { 
       rotation: -45, 
       style: { 
        fontSize: '13px', 
        fontFamily: 'Verdana, sans-serif' 
       } 
      } 
     }, 
     yAxis: { 
      min: 0, 
      title: { 
       text: 'Prevalence (%)' 
      } 
     }, 
     legend: { 
      enabled: false 
     }, 
     tooltip: { 
      pointFormat: 'PED Prevalence: <b>{point.y:.1f} %</b>' 
     }, 
     series: [{ 
      name: 'Prevalence', 
      data: [ 
       ['WADA All Pros', 2], 
       ['Child Athletes', 4], 
       ['HS Football', 6.3], 
       ['HS Seniors All Sports', 6.6], 
       ['Amatuer Weight-lifters', 8.2], 
       ['American Football', 9], 
       ['Baseball', 9.4], 
       ['Research Estimate All Pros', 10.2], 
       ['Top 100 Sprinters (running)', 40], 
       ['Professional Bodybuilders', 54], 
       ['Tour de France Winners', 79], 

      ], 
      dataLabels: { 
       enabled: true, 
       rotation: -90, 
       color: '#FFFFFF', 
       align: 'right', 
       x: 4, 
       y: -15, 
       style: { 
        fontSize: '13px', 
        fontFamily: 'Verdana, sans-serif', 
        textShadow: '0 0 3px black' 
       } 
      } 
     }] 
    }); 
}); 

</hmtl>

來源

2015-01-17 Kamandsam

瀏覽器中的javascript控制檯說什麼？ –

您可能需要在加載'highcharts'之前加載'jQuery'。 – Barmar

如何在添加高圖之前添加jquery？ – Kamandsam

地方jQuery腳本，不要忘記關閉<script>標籤

<html> 
<script src="http://code.jquery.com/jquery-2.1.3.min.js"></script> 
<script src="http://code.highcharts.com/highcharts.js"></script> 
<script src="http://code.highcharts.com/modules/exporting.js"></script> 


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

<script> 
$(function() { 
    $('#container').highcharts({ 
     chart: { 
      type: 'column' 
     }, 
     title: { 
      text: 'Prevalence of Performance Enhancing Drug Use By Sport' 
     }, 
     subtitle: { 
      text: 'Source: <a href="http://www.samuelwbennett.com">getfast</a>' 
     }, 
     xAxis: { 
      type: 'category', 
      labels: { 
       rotation: -45, 
       style: { 
        fontSize: '13px', 
        fontFamily: 'Verdana, sans-serif' 
       } 
      } 
     }, 
     yAxis: { 
      min: 0, 
      title: { 
       text: 'Prevalence (%)' 
      } 
     }, 
     legend: { 
      enabled: false 
     }, 
     tooltip: { 
      pointFormat: 'PED Prevalence: <b>{point.y:.1f} %</b>' 
     }, 
     series: [{ 
      name: 'Prevalence', 
      data: [ 
       ['WADA All Pros', 2], 
       ['Child Athletes', 4], 
       ['HS Football', 6.3], 
       ['HS Seniors All Sports', 6.6], 
       ['Amatuer Weight-lifters', 8.2], 
       ['American Football', 9], 
       ['Baseball', 9.4], 
       ['Research Estimate All Pros', 10.2], 
       ['Top 100 Sprinters (running)', 40], 
       ['Professional Bodybuilders', 54], 
       ['Tour de France Winners', 79], 

      ], 
      dataLabels: { 
       enabled: true, 
       rotation: -90, 
       color: '#FFFFFF', 
       align: 'right', 
       x: 4, 
       y: -15, 
       style: { 
        fontSize: '13px', 
        fontFamily: 'Verdana, sans-serif', 
        textShadow: '0 0 3px black' 
       } 
      } 
     }] 
    }); 
}); 
</script> 

</hmtl>

來源

2015-01-17 02:16:13

非常感謝。這段代碼仍然不起作用？ – Kamandsam

這是在我的本地工作，有錯過什麼？ –

以下是我在網站上發佈的內容：http://imgur.com/SzCzISL – Kamandsam

你在你的Highcharts腳本的末尾缺少一個右</script>標籤。添加結束標記並確保在加載Highcharts腳本之前加載jQuery應該很好。

所以它應該是：

<html> 
<head> 
    <script src="http://code.jquery.com/jquery-2.1.3.min.js"></script> 
    <script src="http://code.highcharts.com/highcharts.js"></script> 
    <script src="http://code.highcharts.com/modules/exporting.js"></script> 

    <script> 

     <!-- your Highcharts script here... --> 

    </script> 
</head> 

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

工作示例可以看出here。

來源

2015-01-18 00:20:43

爲什麼不能在我的網站上使用此代碼

回答

相關問題