If you don't get helped for a long time (over a week) or have an urgent question to ask, you may also send an email to
[email protected]
. Please attach the issue link if it's a technical questions.
<script type="text/javascript">
var selectEventArrays_1_name = ['区域1', '区域2', '区域3', '区域4', '区域5'];//区域统计条件
var echart1_ele_data = [132468, 132468, 132468, 132467, 132467];//区域统计-累计用电量data
$(function () {
echart1();
function echart1() {
echart1_ele();
function echart1_ele() {
// 基于准备好的dom，初始化echarts实例
var echart1_ele = echarts.init(document.getElementById('echart1_ele'));
// 指定图表的配置项和数据
var option = {
tooltip: {//提示框组件
trigger: 'axis'
legend: {//图例组件
data: ['累计用电量'] //图例的数据数组。数组项通常为一个字符串，每一项代表一个系列的 name
toolbox: {
show: true,
feature: {
mark: {show: true},
dataView: {show: true, readOnly: false},
magicType: {show: true, type: ['line', 'bar']},
restore: {show: true},
saveAsImage: {show: true}
calculable: true,
xAxis: [//直角坐标系 grid 中的 x 轴
type: 'category',
axisLabel: {
interval: 0,
rotate: 40
data: selectEventArrays_1_name,
boundaryGap: ['5%', '5%']//留白大小，坐标轴两边留白
yAxis: [
name: '单位(kWh)',
type: 'value',
axisTick: {
inside: true
scale: true,
axisLabel: {
margin: 2,
formatter: function (value, index) {
if (value >= 10000 && value < 10000000) {
value = (value / 10000).toFixed(4) + "万";
} else if (value >= 10000000) {
value = (value / 10000000).toFixed(7) + "千万";
return value;
series: [//系列列表
name: '累计用电量', //系列名称，用于tooltip的显示，legend 的图例筛选
type: 'bar', //类型
data: echart1_ele_data, //系列中的数据内容数组。数组项通常为具体的数据项
itemStyle: {//上方显示数值
normal: {
label: {
show: true, //开启显示
position: 'inside', //在上方显示
textStyle: {//数值样式
color: 'black',
fontSize: 16
color: function (params) {
//注意，如果颜色太少的话，后面颜色不会自动循环，最好多定义几个颜色
var colorList = ['#2584cd'];
return colorList[params.dataIndex]
echart1_ele.clear();
echart1_ele.setOption(option);
</script>
</body>
</html>
Hello, yufeng04.
Most of the time, we create charts for leaders/data analysts/executives.There is data, but it is shown as zero, this effect will be questioned by many people.
I can only give here a situation where I personally think it would be better if a small bar could be a quarter of the canvas.But I don't have an effective formula yet, sorry
其实还是不明白你具体的需求是什么？log 轴可以满足吗？https://echarts.apache.org/zh/option.html#yAxis.type
我理解，他是想要一个类似的归一化算法，计算出来barMinHeight
@TRSK-CONMI 我觉得可以自己写一个算法，动态设置 barMinHeight是不是能解决问题
@TRSK-CONMI 我没理解这为什么是一个 bug？你所说的数值最大触顶最小值触底为什么不符合预期呢？难道数值 1 对应的高度不就应该是几乎不可见的吗？
业务层面，我可以理解说加一个 minHeight，但是为什么这是 bug？其他场景为什么也同样需要 minHeight 呢？
https://user-images.githubusercontent.com/39817817/81885803-b83c1100-95cd-11ea-81e5-e4568fec4401.jpg
这个视图的效果几乎可以说什么都没加的，你会觉得这样的视图是正常的吗~~
@TRSK-CONMI
(A) 不设置 yAxis.scale: false 。因为如果 yAxis.scale: false 则柱状图不从零点开始，这对于柱状图来说往往是可能引起误导的可视化方式。
(B) 如果确实要设置 yAxis.scale: true 那么可以选择不使用柱状图，而使用 scatter 之类。
(C) 如果确实要设置 yAxis.scale: true 且要使用柱状图，那么可以设置 yAxis.min 和 yAxis.max 调节 y 轴的显示范围。
@TRSK-CONMI
(A) 不设置 yAxis.scale: false 。因为如果 yAxis.scale: false 则柱状图不从零点开始，这对于柱状图来说往往是可能引起误导的可视化方式。
(B) 如果确实要设置 yAxis.scale: true 那么可以选择不使用柱状图，而使用 scatter 之类。
(C) 如果确实要设置 yAxis.scale: true 且要使用柱状图，那么可以设置 yAxis.min 和 yAxis.max 调节 y 轴的显示范围。
你好，100pah。
我在API中没找到“scale”相关的内容，然后百度了一下。发现“scale设置为true后，坐标刻度不会强制包含零刻度。（注意：只在数值轴中（type:'value'）中有效）”（网页：https://blog.csdn.net/hao_0420/article/details/81188714）
scale和yAxis.min/yAxis.max这本身的设计是不是一个冲突？
或者说是为了出现BUG的时候可以更底层地调用来解决？
