怎么让下面代码的柱状图 两根柱子之间无缝 option = { legend: {}, dataset: { dimensions: ['product', '2016', '2017'], source: [ { product: '1', 2016: 85.8, 2017: 93.7 }, { product: '2', 2016: 73.4, 2017: 55.1 }, { product: '3', 2016: 65.2, 2017: 82.5 }, { product: '4', 2016: 53.9, 2017: -39.1 } ] }, xAxis: { type: 'category' }, yAxis: {}, series: [ { type: 'bar', barWidth: 12, barCategoryGap: '0' }, { type: 'bar', barWidth: 12, barCategoryGap: '0' } ] };
时间: 2024-04-23 18:27:34 浏览: 142
要让下面的代码中的柱状图两根柱子之间无缝,你可以将 `barCategoryGap` 属性的值设置为 `'0%'`,并且将 `barWidth` 属性的值设置得足够小,以确保柱子之间没有间隔。以下是修改后的代码示例:
```javascript
option = {
legend: {},
dataset: {
dimensions: ['product', '2016', '2017'],
source: [
{ product: '1', 2016: 85.8, 2017: 93.7 },
{ product: '2', 2016: 73.4, 2017: 55.1 },
{ product: '3', 2016: 65.2, 2017: 82.5 },
{ product: '4', 2016: 53.9, 2017: -39.1 }
]
},
xAxis: { type: 'category' },
yAxis: {},
series: [
{
type: 'bar',
barWidth: 4, // 设置足够小的宽度
barCategoryGap: '0%' // 设置柱子之间无缝
},
{
type: 'bar',
barWidth: 4, // 设置足够小的宽度
barCategoryGap: '0%' // 设置柱子之间无缝
}
]
};
```
通过将 `barCategoryGap` 属性设置为 `'0%'`,并将 `barWidth` 属性设置为一个足够小的值(例如4),你可以实现两根柱子之间无缝的效果。记得根据需要进行相应的配置调整。
阅读全文