1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > echarts去除网格线_echarts实现去掉X轴 Y轴和网格线效果实例分享

echarts去除网格线_echarts实现去掉X轴 Y轴和网格线效果实例分享

时间:2020-08-09 06:42:03

相关推荐

echarts去除网格线_echarts实现去掉X轴 Y轴和网格线效果实例分享

本文主要介绍了jQuery插件echarts实现的去掉X轴、Y轴和网格线效果,结合实例形式分析了echarts插件绘制表格图及图形相关属性设置操作技巧,并附带demo源码供读者下载参考,需要的朋友可以参考下,希望能帮助到大家。

本文实例讲述了jQuery插件echarts实现的去掉X轴、Y轴和网格线效果。分享给大家供大家参考,具体如下:

1、问题背景:

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

2、实现源码:

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

$(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

{

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);

});

3、实现效果图:

相关推荐:

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。