• echarts 横坐标分行展示,以及文字显示顶部


    X轴文字 分行展示

    xAxis : [
                                    {
                                        splitLine:{show:false},
                                        type : 'category',
                                        data : ['社交人际','沟通交流','心理认知','游戏玩耍','大小运动','生活自理','执行管控','知识常识'],
                                        splitArea:{show:false},
                                        axisLabel: {
                                            show: true,
                                            interval:0,
                                            formatter:function(params) {
                                                var newParamsName = "";
                                                var paramsNameNumber = params.length;
                                                var provideNumber = 2;  //一行显示几个字
                                                var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
                                                if (paramsNameNumber > provideNumber) {
                                                    for (var p = 0; p < rowNumber; p++) {
                                                        var tempStr = "";
                                                        var start = p * provideNumber;
                                                        var end = start + provideNumber;
                                                        if (p == rowNumber - 1) {
                                                            tempStr = params.substring(start, paramsNameNumber);
                                                        } else {
                                                            tempStr = params.substring(start, end) + "
    ";
                                                        }
                                                        newParamsName += tempStr;
                                                    }
    
                                                } else {
                                                    newParamsName = params;
                                                }
                                                return newParamsName
                                            },
                                            textStyle: {
                                                color: '#6861a6' //文字颜色
                                            }
                                        }
                                    },
    

      文字上方显示

    series: [
             {type: 'bar',
             itemStyle: {
             	normal: {
             		label: {
    											show: true, //开启显示
    											position: 'top', //在上方显示
    											textStyle: { //数值样式
    												color: 'black',
    												fontSize: 16
    											}
    										}
    									}
    								}
    							},
    							{type: 'bar',
    							itemStyle: {
    								normal: {
    									label: {
    									show: true, //开启显示
    									position: 'top', //在上方显示
    									textStyle: { //数值样式
    										color: 'black',
    										fontSize: 16
    									}
    								}
    							}
    						}
    					}
    
    					]
    

      数组分批插入

    objdis=[]; 
    objname=[]; objnames=[]; 
    objyd=[]; 
    objyds=[];objydss=[];
    objad=[]; 
    for (var i = 0; i < $(".disyd").length-1; i++) {
    	objname[i]=parseInt($(".disname:eq("+i+")").text());
    	objyd[i]  =parseInt($(".disyd:eq("+i+")").text());
    	objyds[i]  =parseInt($(".disyd:eq("+i+")").text());
    	objydss[i]  =parseInt($(".disyd:eq("+i+")").text());
    	objad[i]  =parseInt($(".disad:eq("+i+")").text());	
    
    }
    
    
    zhuanhuans(objname,objyd) ;
    zhuanhuans(objad,objyds) ;
    zhuanhuans(disease_name,objydss) ;
    
    for (var i = 0; i < $(".disyd").length-1; i++) {
    
    	objdis[i] = [disease_name[i],objyd[i],objad[i]]
    }
    
    objdis.unshift(['日期','到诊','对话量']) 	
    

      

  • 相关阅读:
    NLPIR大数据语义系统文本数据分析挖掘平台
    NLPIR:中文语义挖掘是自然语言处理的关键
    NLPIR-JZSearch智能搜索深层挖掘大数据资源
    NLPIR智能Protege知识图谱实现多场景应用
    DotNet加密方式解析--散列加密
    SSO单点登录PHP简单版
    xss框架基础框架实现
    Kafka Offset Storage
    C#如何使用ES
    模拟Vue之数据驱动
  • 原文地址:https://www.cnblogs.com/nice2018/p/11018042.html
Copyright © 2020-2023  润新知