个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
26
4
我想在 Highcharts 中创建一个分组柱形图，除了在给定的一天有多个组。该图看起来像这样 http://www.highcharts.com/demo/column-stacked-and-grouped (来自这个论坛问题 http://highslide.com/forum/viewtopic.php?f=9&t=19575 )，除了每个堆叠条替换为一组分组的列(非堆叠)。因此，我们每天会看到多组列，其想法是每组对应一个用户。有谁知道如何做到这一点？
编辑:这是我找到的一个 jsfiddle http://jsfiddle.net/pMA2H/1/
<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>ElementStacks - jsFiddle demo</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.2.js'></script>
<link rel="stylesheet" type="text/css" href="/css/normalize.css"/>
<link rel="stylesheet" type="text/css" href="/css/result-light.css"/>
<script type='text/javascript' src="http://highcharts.com/js/testing.js"></script>
<style type='text/css'>
</style>
<script type='text/javascript'>//<![CDATA[
$(function(){
/*
Data is:
Gross Amount Cost Amount
Services Australia 20 10
Germany 30 15
Manufacturing Australia 35 17
Germany 25 12
----
Would like to be able define my categories hierarchically - example:
xAxis: [{
categories: [{
name: 'Services'
children: ['Australia', 'Germany']
},{
name: 'Manufacturing'
children: ['Australia', 'Germany']
}]
}]
and get a result similar to what is fudged up by using the renderer on the right.
*/
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'column'
},
xAxis: [{
categories: ['Australia', 'Germany', 'Australia', 'Germany'],
labels: {
y: 40
}
}],
legend: {
margin: 40
},
series: [{
name: 'Gross',
data: [['Services', 20],['Services',30],['Manufacturing', 35],['Manufacturing', 25]]
},{
name: 'Cost',
data: [['Services', 10],['Services',15],['Manufacturing', 17],['Manufacturing', 13]]
}]
}, function(chart){
$('.highcharts-axis:first > text').each(function() {
this.setAttribute('y', parseInt(this.getAttribute('y')) - 20)
});
var text1 = chart.renderer.text("Services", 150, 340).add();
var text2 = chart.renderer.text("Manufacturing", 350, 340).add();
});
});//]]>
</script>
</head>
<body>
<div id="container" style="height: 400px; width: 500px"></div>
</body>
</html>
来自此处的线程 http://highcharts.uservoice.com/forums/55896-general/suggestions/2230615-grouped-x-axis#comments .虽然 x 轴增量的代码有点乏味，因为您必须手动添加每个增量并包括其间距以确保您的数据点对齐。我以前做过图表，您可以在其中为日期指定 pointStart 和 pointInterval。如果有人知道更优雅的解决方案，那就太好了。
最佳答案
您可以为分组类别使用插件，在这里您可以找到它:https://github.com/blacklabel/grouped_categories
关于charts - 具有多个组的 Highcharts 分组柱形图？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16308735/
26
4
0
我想 reshape pandas 数据框， 我有这种格式的 csv 文件 #Result;ID;Date;Events;type 12;1240422;10/01/2017 10:10;1;Item
我有一个现有的 Highcharts ，我需要在其上突出显示单个列。 这是一个已经存在了一段时间的百分位图，我对 Highcharts 仍然很陌生，但我在这里看到了一个类似的问题，这个问题虽然涉及堆叠
我有一个多系列柱形图(在本例中为 3 个)。我想在所有系列的列上覆盖一条线。所以我用相同的列系列数据创建了另外 3 个 Line 系列。当只有一列和一行系列时，这非常有效。对于多个系列，线条呈现在类别
我是一名优秀的程序员,十分优秀！