EChart隐藏xAxis、yAxis的问题。

cqwcns 发表于 2022-10-20 16:19

如图和以下代码，我希望创建一个极简的bar图，不要希望显示 xAxis、yAxis。
只要bar条和tooltip就行。
各位查了一下官方配置项，未找到。
各位大佬有是否知道实现方法，请指教，感谢。

<!DOCTYPE html>
<html lang="zh-CN" style="height: 100%">

<head>
<meta charset="utf-8">
</head>

<body style="height: 100%; margin: 0">
<div id="container" style="height: 100%"></div>
<script type="text/javascript" src="https://fastly.jsdelivr.net/npm/echarts@5.4.0/dist/echarts.min.js"></script>

<script type="text/javascript">
   var dom = document.getElementById('container');
   var myChart = echarts.init(dom, null, {
         renderer: 'canvas',
         useDirtyRect: false
   });
   var option = {
         tooltip: {},
         xAxis: {},
         yAxis: {
            data: ['Brazil', 'Indonesia', 'USA', 'India', 'China', 'World']
         },
         series: [
            {
               type: 'bar',
               data:
            }
         ]
   };

   if (option && typeof option === 'object') {
         myChart.setOption(option);
   }

   window.addEventListener('resize', myChart.resize);
</script>
</body>

</html>

Sen 发表于 2022-10-20 16:25

yAxis: {
type: 'value',
splitLine: { // 控制背景长横线
show: true,
color: '#e0e0e0'
},
axisLine: { // 控制Y轴刻度线
show: false,
lineStyle: {
color: '#333333'
}
},
axisTick: { // 控制Y轴显示
show: false
}
}

cqwcns 发表于 2022-10-20 16:27

各位大佬我错了，看文档找错了位置。

已解决。

var option = {
         tooltip: {},
         xAxis: {
            show: false
         },
         yAxis: {
            show: false,
            data: ['Brazil', 'Indonesia', 'USA', 'India', 'China', 'World']
         },
         series: [
            {
               type: 'bar',
               data:
            }
         ]
   };

haoshu 发表于 2022-10-20 16:30

本帖最后由 haoshu 于 2022-10-20 16:32 编辑

xAxis: {
show: false
},
yAxis: {
data: []
},

你的某些快乐 发表于 2022-10-20 17:11

<!DOCTYPE html>
<html lang="zh-CN" style="height: 100%">

<head>
<meta charset="utf-8">
</head>

<body style="height: 100%; margin: 0">
<div id="container" style="height: 100%"></div>
<script type="text/javascript" src="https://fastly.jsdelivr.net/npm/echarts@5.4.0/dist/echarts.min.js"></script>

<script type="text/javascript">
var dom = document.getElementById('container');
var myChart = echarts.init(dom, null, {
   renderer: 'canvas',
   useDirtyRect: false
});
var option = {
   tooltip: {},
   xAxis: {
   axisLabel: {
      show: false,
   }
   },

   yAxis: {
   show: false,
   data: ['Brazil', 'Indonesia', 'USA', 'India', 'China', 'World']
   },
   series: [
   {
      type: 'bar',
      data:
   }
   ]
};

if (option && typeof option === 'object') {
   myChart.setOption(option);
}

window.addEventListener('resize', myChart.resize);
</script>
</body>

</html>

页: [1]

吾爱破解 - 52pojie.cn's Archiver

EChart隐藏xAxis、yAxis的问题。