javascript - 从radialBar Apexcharts 中删除多余的空间
问题描述
我是 apexcharts 的新手,无法弄清楚如何删除此径向条形图中的多余空间。
我想拥有与我创建的相同类型的甜甜圈图,但周围没有额外的空间。
我的代码有 Javascript 和 HTML:
正如您在“图表:”中看到的那样,设置了高度,但我仍然得到了空格
var options = {
chart: {
height:140,
width:100,
type: 'radialBar',
offsetY: 0,
toolbar: {
show: false
}
},
plotOptions: {
radialBar: {
size:50,
hollow: {
margin: 0,
size: '65%',
background: '#fff',
},
track: {
background: '#F5F5FF',
strokeWidth: '75%',
margin: 0, // margin is in pixels
},
dataLabels: {
showOn: 'always',
name: {
offsetY: 0,
show: false,
color: '#003366',
fontSize: '17px'
},
value: {
formatter: function(val) {
return parseInt(val);
},
color: '#003366',
fontSize: '18px',
show: true,
offsetY: 10,
}
}
}
},
fill: {
colors:['#57CAF0']
},
series: [75],
stroke: {
lineCap: 'round'
},
}
var chart = new ApexCharts(
document.querySelector("#chart"),
options
);
chart.render();
<div id="chart"></div>
<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
我的代码链接
https://codepen.io/wasifhafeez/pen/JjPyGNa?editors=1010
解决方案
这是 ApexCharts 中的一个错误。我刚刚推送了一个提交,它删除了径向条形图的不必要间距。
推荐阅读
- c# - 从基于另一种类型的集合中检索泛型类
- jquery - svg中的jquery选择类
- html - 如何创建不占用整个屏幕的导航栏折叠?
- reactjs - 在 React 中观察 Solidity 合约事件的最佳地点
- javascript - Dynamically populate a single field based on dropdown selections (Javascript / HTML)
- c - __attribute__ on function pointers
- r - How to get the number of children in XML in R
- sql - 如何在 SQL 中提取过去的最近日期
- python - 当您可以在 Python 中使用类/实例方法时,为什么还要使用静态方法?
- windows - 如何在 Visual Studio Code (VSC) 中打开多个文件?