欢迎进入广州凡科互联网科技有限公司网站
全国服务热线
4000-399-000
小程序有什么类型_jQuery插件echarts完成的去掉X轴
时间: 2021-01-12 13:26 浏览次数:
jQuery软件echarts完成的除掉X轴、Y轴和网格图线实际效果实例【附demo源代码免费下载】 本文关键详细介绍了jQuery软件echarts完成的除掉X轴、Y轴和网格图线实际效果,融合案例方式剖析
jQuery插件echarts实现的去掉X轴、Y轴和网格线效果示例【附demo源码下载】       这篇文章主要介绍了jQuery插件echarts实现的去掉X轴、Y轴和网格线效果,结合实例形式分析了echarts插件绘制表格图及图形相关属性设置操作技巧,并附带demo源码供读者下载参考,需要的朋友可以参考下

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

1、问题背景:

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

2、实现源码:

 !DOCTYPE html 
 html 
 head 
 meta charset="UTF-8" 
 title echarts-去掉X轴、Y轴和网格线 /title 
 script type="text/javascript" src="jquery-1.4.2.min.js" /script 
 script type="text/javascript" src="echarts.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 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" /div 
 /body 
 /html 

3、实现效果图:

附:完整实例代码点击此处。

更多关于jQuery相关内容感兴趣的读者可查看本站专题:《》、《》、《》、《》、《》及《》

希望本文所述对大家jQuery程序设计有所帮助。


下一篇:没有了


Copyright © 广州凡科互联网科技有限公司 版权所有 粤ICP备10235580号
全国服务电话:4000-399-000   传真:021-45545458
公司地址:广州市海珠区工业大道北67号凤凰创意园