echarts-去掉X轴 Y轴和网格线

最新推荐文章于 2024-05-15 14:35:51 发布

原创最新推荐文章于 2024-05-15 14:35:51 发布 · 3.3k 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍如何在ECharts中仅保留数据图形，去除X轴、Y轴及网格线。通过设置ECharts配置项，可以实现图表的简洁展示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、问题背景

如何在echarts中，去掉X轴、Y轴和网格线，只留数据图形

2、实现源码

<!DOCTYPE html><html> <head>  <meta charset="UTF-8">  <title>echarts-去掉X轴、Y轴和网格线</title>  <link rel="shortcut icon" href="../js/echarts-2.2.7/doc/asset/ico/favicon.png">  <script type="text/javascript" src="../js/echarts-2.2.7/doc/asset/js/jquery.min.js" ></script>  <script type="text/javascript" src="../js/echarts-2.2.7/doc/example/www2/js/echarts-all.js" ></script>      <script>   $(function(){    function randomDataArray() {        var d = [];        var arr = [3,5,7,9,10,1,2,4,8,6];        var len = 10;        for(var i=0;i<len;i++)        {         d.push([i+1,0,arr[i],]);        }                return d;    }              var chart = document.getElementById('chart');                  var echart = echarts.init(chart);                                    var option = {        legend: {            data:['scatter1'],            show:false        },        textStyle:{         fontSize:16        },        xAxis : [            {                type : 'value',                splitNumber: 2,                scale: true,                show:false,                splitLine:{      　　　　show:false      　　}            }        ],        yAxis : [            {                type : 'value',                splitNumber: 2,                scale: true,                show:false,                splitLine:{      　　　　show:false      　　 }            }        ],        series : [            {                name:'scatter1',                type:'scatter',                symbol: 'emptyCircle',                symbolSize: 20,                itemStyle : {                  normal: {                  label:{                   show: true,                    position: 'inside',                   textStyle : {                                fontSize : 24,                                fontFamily : '微软雅黑',                                color:'#FF0000'                            }                  }                 }                },                data: randomDataArray()            }        ]    };                                    echart.setOption(option);     });     </script> </head> <body>     <div id="chart" style="width: 1200px; height: 220px;"></div> </body></html>