我有一个问题是在容器div中显示我的Highchart。
在.html文件中,我有下一个代码:
<div class="col-md-12" style="margin-top:10px">
<div id="container" style="width:100%; height: 500px;"></div>
在我的控制器中,我有一个功能,我在对DB进行查询并将数据保存在可变介质中后创建图表。图表创建如下:
var myChart = Highcharts.chart('container', {
chart: {
type: 'column'
},
title: {
text: 'Media'
},
subtitle: {
text: '..'
},
xAxis: {
type: 'category',
labels: {
rotation: -45,
style: {
fontSize: '13px',
fontFamily: 'Verdana, sans-serif'
}
}
},
yAxis: {
min: 0,
title: {
text: 'Media'
}
},
legend: {
enabled: false
},
tooltip: {
pointFormat: 'Media: {point.y:.1f}'
},
series: [{
name: 'Population',
data: media,
dataLabels: {
enabled: true,
rotation: -90,
color: '#FFFFFF',
align: 'right',
format: '{point.y:.1f}', // one decimal
y: 10, // 10 pixels down from the top
style: {
fontSize: '13px',
fontFamily: 'Verdana, sans-serif'
}
}
}]
});
&#34;数据&#34;收到正确,问题是,当我点击按钮调用此功能并尝试显示图表时,显示&#34; http://localhost:8080/graphics #container &#34;在我的地址栏中,但在我第二次点击按钮之前,图表不会出现。
我不明白为什么会发生这种情况,如何在我的&#34;首先点击&#34;
中显示数据?如果有人能帮助我,我将非常感激。
谢谢!
解决
问题是我用来移动卷轴的另一个功能。我删除了它,一切正常!
功能如下:
function downScroll(){
$location.hash('container');
call $anchorScroll()
$anchorScroll();
}