javascript - ApexCharts 强制 100% 高度
问题描述
我已经为这个问题苦苦挣扎了一段时间,我需要在height
你的容器中拥有 100% 的图形。
对于我向他表明他的身高:'100%' 的权重,上面和下面仍然有空格,tabiem 我给予了false
重视,yaxis
但问题仍然存在。
能解决它的人将不胜感激。
var options = {
chart: {
type: 'line',
width: '100%',
height: '100%',
toolbar: {
show: false
},
},
grid: {
show: false,
padding: {
left: 0,
right: 0
}
},
tooltip: {
intersect: false,
x: {
show: false
},
marker: {
show: false
}
},
dataLabels: {
enabled: false
},
yaxis: {
show: false,
},
xaxis: {
tooltip: {
enabled: false
},
labels: {
show: false
},
axisBorder: {
show: false
}
},
series: [{
name: 'sales',
data: [30,40,35,50,49,60,70,91,125]
}]
}
var chart = new ApexCharts(document.querySelector("#chart"), options);
chart.render();
#chart{
width: 500px;
height: 200px;
border: 1px solid #000;
}
<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
<div id="chart"></div>
解决方案
如果不需要显示x轴、y轴,可以打开sparkline.enabled
flag去掉图表区域上下所有不必要的空格
chart: {
sparkline: {
enabled: true
}
}
推荐阅读
- javascript - 从 Promise 返回值然后回调函数
- javascript - 使用函数按值对 JavaScript 对象进行排序
- excel - 使用 Powershell 设置 Excel 复选框值
- ruby - 通过 Ruby 连接器获取 MongoDB 对象大小
- javascript - numberVarible 不显示在 id 的右侧:在 JavaScript / jQuery 代码中
- java - Libgdx android无法从本地文件中读取
- reactjs - React - 您可以从外部函数更新未声明的容器状态吗?
- python - 如何从正则表达式模式返回随机字符?蟒蛇 3
- windows - 跨平台可移植开发环境建议
- android - 使用 Android CvCameraViewListener2 实时检测对象坐标以进行进一步处理而不显示相机图像