web.py チュートリアルに従って、テンプレートをレンダリングする簡単なサイトを作成しました。
次に、/static の下に highcharts.js をロードし、ディストリビューションに含まれている highcharts サンプルの 1 つを実行しようとしました。
ハイチャートのサンプル コードをコピーしてテンプレートに貼り付けて実行しようとすると、エラー 500 と "NameError: グローバル名 'ドキュメント' が定義されていません" が表示されます。
私のハイチャートテンプレートは以下です。以下のコードは、highcharts のサンプル ディレクトリから実行すると通常の .html として機能しますが、web.py でレンダリングしようとするとNameError: global name 'document' is not definedでエラーになります。
もう 1 つ - chart1 をレンダリングする命令を含むスクリプトを削除すると、次に JavaScript コンソールを開くと、jQuery、Highcharts、およびドキュメントにアクセスできます。次に曲がるかどうかは本当にわかりません。
テンプレートコード:
$def with (name)
<!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>Highcharts Example</title>
<!-- 1. Add these JavaScript inclusions in the head of your page -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="/static/js/highcharts.js"></script>
<script>
var chart1; // globally available
$(document).ready(function() {
chart1 = new Highcharts.Chart({
chart: {
renderTo: 'chart-container-1',
defaultSeriesType: 'bar'
},
title: {
text: 'Fruit Consumption'
},
xAxis: {
categories: ['Apples', 'Bananas', 'Oranges']
},
yAxis: {
title: {
text: 'Fruit eaten'
}
},
series: [{
name: 'Jane',
data: [1, 0, 4]
}, {
name: 'John',
data: [5, 7, 3]
}]
});
});
</script>
</head>
<body>
<div id="chart-container-1" style="width: 100%; height: 400px"></div>
</body>
</html>