Highstock 和 Highcharts：我如何在同一页面上使用 StockChart 和饼图
我对在同一页面上使用 highstock stockchart 和 highcharts 饼图感到困惑。在这两种方式中，我都使用 JSON 获取数据。浏览器在呈现 Highcharts.Chart 类型饼图时无法正确呈现 Highcharts.StockChart。
这是我使用的代码段：
<script type="text/javascript">
$("document").ready(function() {
$.getJSON('http://localhost:3000/reports/hits?callback=?', function(data) {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container'
},
...
},
series: [{
name: 'Name',
data: data,
tooltip: {
yDecimals: 0
}
}]
});
})
$.getJSON('http://localhost:3000/reports/daily_hit?callback=?', function(data) {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container1',
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
...
series: [{
type: 'pie',
name: 'Hit',
data: data
}]
});
})
}
);
</script>
I have a confusion about using the highstock stockchart and highcharts pie-chart on the same page. In both ways, I am getting the data using JSON. The browser cannot render the Highcharts.StockChart properly whereas it renders Highcharts.Chart type pie.
Here is the code segment that I use:
<script type="text/javascript">
$("document").ready(function() {
$.getJSON('http://localhost:3000/reports/hits?callback=?', function(data) {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container'
},
...
},
series: [{
name: 'Name',
data: data,
tooltip: {
yDecimals: 0
}
}]
});
})
$.getJSON('http://localhost:3000/reports/daily_hit?callback=?', function(data) {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container1',
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
...
series: [{
type: 'pie',
name: 'Hit',
data: data
}]
});
})
}
);
</script>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
当我尝试使用 Highstock 图表和 Angular Gauge 时，我遇到了同样的问题，
当我尝试像这样重新排列 highstock highchart javascript 库时，问题就解决了
，或者（如果您不想使用额外的图形）
我希望它有用
I have experienced the same problem when I tried to use Highstock chart and Angular Gauge,
And the problem was solved when I try to rearrange highstock highchart javascript library like this
or (if you don't want to use additional graphics)
I hope it can be useful
解决方案很简单，首先放置 highstock，然后放置 highchart，如下所示：
不要忘记放置 jQuery！
这解决了我的问题，希望能帮到你
The solution is easy, put first highstock and then highchart like this:
Dont's forget put the jQuery!!
This solve my problem, I hope can help you