timelinechart无法将Array解码为JSON:
问题描述:
对于下图,我遇到了无法将数组解码为JSON:"的问题.其余图表似乎都可以使用这种格式,但不适用于这种格式.
I'm getting the issue "couldn't decode Array as JSON: " for the below chart. Rest of the charts seem to work with this format but not this one.
<google-chart type='timeline' options='{"title": "Timeline",
"legend" : {"position" : "bottom", "alignment": "start"}
}' cols='[{"label":"Question", "type":"string"},
{"label":"Number", "type":"string"},
{"label":"Start", "type":"date"},
{"label":"End", "type":"date"} ]'
rows='[["Question1", "1", new Date(0,0,0,12,0,0), new Date(0,0,0,12,30,0)],
["Question2", "2", new Date(0,0,0,12,30,0), new Date(0,0,0,12,45,0)],
["Question3", "3", new Date(0,0,0,12,45,0), new Date(0,0,0,1,0,0)],
["Question4", "4", new Date(0,0,0,1,0,0), new Date(0,0,0,1,12,0)],
["Question5", "5", new Date(0,0,0,1,12,0), new Date(0,0,0,1,30,0)]]'>
</google-chart>
答
我几乎没有更改您的代码,现在它可以正常工作了.
I little changed your code and its now working.
<google-chart id="timeline" type='timeline' options='{"title": "Timeline"}'>
</google-chart>
和脚本:
ready() {
super.ready();
Polymer.RenderStatus.afterNextRender(this, () => {this.showChartTable(); })
}
showChartTable(){
var chart = this.shadowRoot.querySelector('#timeline');
document.createElement('google-chart-loader').dataTable([
['Question', 'Number', 'Start','End'],
["Question1", "1", new Date(1789, 3, 30), new Date(1800, 3, 30)], ["Question2", "2", new Date(1800, 3, 30), new Date(1900, 3, 30)], ["Question3", "3", new Date(1900, 3, 30), new Date(2000, 3, 30)], ["Question4", "4", new Date(2000, 3, 30), new Date(2018, 3, 30)], ["Question5", "5", new Date(2018, 3, 30),new Date(2020, 3, 30)]] ).then(function(dataTable) {
chart.data = dataTable;
});
}
由于时间轴逻辑的原因,您应该定义一个有效的时间轴.您的日期有误.
Due to timeline logic, you should define a valid time line. Your dates gives error.
无需将此图表保留在connectedCallback
中.只需使用以下命名函数即可:showChartTable
(我更改了)
no need to keep this chart inside connectedCallback
. just move on own named functions as: showChartTable
(I changed)