我正在尝试使用 gae-init 框架使此代码正常工作，该框架使用 Flask 和 google 应用引擎。
如果我单独运行它，并且所有代码都来自这个文件，则该代码可以正常工作:
<head>
<title>Google Chart Example</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://prithwis.x10.bz/charts/jquery.csv-0.71.js"></script>
<script src="https://www.google.com/jsapi"></script>
<script type='text/javascript'>
// load the visualization library from Google and set a listener
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChartfromCSV);
function drawChartfromCSV(){
// grab the CSV
$.get("https://www.quandl.com/api/v3/datasets/WIKI/AAPL/data.csv?start_date=2015-01-01&order=asc&end_date=2015-04-01&collapse=daily", function(csvString) {
// transform the CSV string into a 2-dimensional array
var arrayData = $.csv.toArrays(csvString, {onParseValue: $.csv.hooks.castToScalar});
// this new DataTable object holds all the data
var data = new google.visualization.arrayToDataTable(arrayData);
// this view can select a subset of the data at a time
var view = new google.visualization.DataView(data);
view.setColumns([0,3,1,4,2]);
var options = {
legend: 'none',
candlestick: {
fallingColor: { strokeWidth: 0, fill: '#a52714' }, // red
risingColor: { strokeWidth: 0, fill: '#0f9d58' } // green
},
colors: ['black'],
height: 700,
};
var chart = new google.visualization.CandlestickChart(document.getElementById('csv2chart'));
chart.draw(view, options);
});
}
</script>
</head>
<body>
<div id="csv2chart"></div>
</body>
但是当我将它包含在我的项目中时，无论我尝试什么，我都会收到“未捕获的类型错误:无法读取未定义的属性'toArrays'”。 src 链接是正确的。我确定了。
# extends 'admin/admin_base.html'
# block title
Google Chart Example
# endblock
# block head
{{super()}}
<script src="{{ url_for('static', filename='ext/jquery/dist/jquery.js') }}"></script>
<script src="{{ url_for('static', filename='new_static/jquery.csv-0.71.js') }}"></script>
<script src="https://www.google.com/jsapi"></script>
<script 'type=text/javascript'>
// load the visualization library from Google and set a listener
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChartfromCSV);
function drawChartfromCSV(){
// grab the CSV
$.get("https://www.quandl.com/api/v3/datasets/WIKI/AAPL/data.csv?start_date=2015-01-01&order=asc&end_date=2015-04-01&collapse=daily", function(csvString) {
// transform the CSV string into a 2-dimensional array
var arrayData = $.csv.toArrays(csvString, {onParseValue: $.csv.hooks.castToScalar});
// this new DataTable object holds all the data
var data = new google.visualization.arrayToDataTable(arrayData);
// this view can select a subset of the data at a time
var view = new google.visualization.DataView(data);
view.setColumns([0,3,1,4,2]);
var options = {
legend: 'none',
candlestick: {
fallingColor: { strokeWidth: 0, fill: '#a52714' }, // red
risingColor: { strokeWidth: 0, fill: '#0f9d58' } // green
},
colors: ['black'],
height: 700,
};
var chart = new google.visualization.CandlestickChart(document.getElementById('csv2chart'));
chart.draw(view, options);
});
}
</script>
# endblock
# block admin_content
<div id="csv2chart"></div>
# endblock
最佳答案
我最终不得不搬家<script type="text/javascript" src="{{ url_for('static', filename='new_static/jquery.csv-0.71.js') }}"></script>一直到底部# block scripts # endblock
不是 100% 确定原因，但我猜测与我正在使用的框架加载内容的顺序有关。
# extends 'admin/admin_base.html'
# block title
Google Chart Example
# endblock
# block head
{{super()}}
<script src="{{ url_for('static', filename='ext/jquery/dist/jquery.js') }}"></script>
<script src="https://www.google.com/jsapi"></script>
<script 'type=text/javascript'>
// load the visualization library from Google and set a listener
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChartfromCSV);
function drawChartfromCSV(){
// grab the CSV
$.get("https://www.quandl.com/api/v3/datasets/WIKI/AAPL/data.csv?start_date=2015-01-01&order=asc&end_date=2015-04-01&collapse=daily", function(csvString) {
// transform the CSV string into a 2-dimensional array
var arrayData = $.csv.toArrays(csvString, {onParseValue: $.csv.hooks.castToScalar});
// this new DataTable object holds all the data
var data = new google.visualization.arrayToDataTable(arrayData);
// this view can select a subset of the data at a time
var view = new google.visualization.DataView(data);
view.setColumns([0,3,1,4,2]);
var options = {
legend: 'none',
candlestick: {
fallingColor: { strokeWidth: 0, fill: '#a52714' }, // red
risingColor: { strokeWidth: 0, fill: '#0f9d58' } // green
},
colors: ['black'],
height: 700,
};
var chart = new google.visualization.CandlestickChart(document.getElementById('csv2chart'));
chart.draw(view, options);
});
}
</script>
# endblock
# block admin_content
<div id="csv2chart"></div>
# endblock
# block scripts
<script type="text/javascript" src="{{ url_for('static', filename='new_static/jquery.csv-0.71.js') }}"></script>
# endblock
关于javascript - 未捕获的类型错误 : Cannot read property 'toArrays' of undefined，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31826182/