echart带有价格的时候,价格数据3位数用逗号分隔

     
操作echart的时候,当包含价格的时候,价格的数据全部显示,需求要求3位数一截取,如下:
图1:


图2:

解决方案:


代码展示:
<script type="text/javascript">
				document.getElementById("begin3").flatpickr();
	            document.getElementById("end3").flatpickr();
			function getChartData3() {
	            var myChart3 = echarts.init(document.getElementById('mychart3'));
	            myChart3.showLoading({  
		            text : "图表数据正在努力加载..."  
		        });
				//投标人中标金额统计分析
				var options3 = {
						title : {
							text : '投标人累积中标金额排前十的数据统计(金额:万元)',
							x : 'center'
						},
						tooltip : {
							trigger : 'axis',
							axisPointer : { // 坐标轴指示器,坐标轴触发有效
								type : 'shadow' // 默认为直线,可选为:'line' | 'shadow'
							}
						},
						toolbox: {
					        show : true,
					        x:'950',//下载的字体显示不全
					        feature : {
					            //dataView : {show: false, readOnly: false},
					            magicType : {show: true, type: ['line', 'bar']},
					            //restore : {show: true},
					            saveAsImage : {show: true}
					        }
					    },
						/* legend : {
							data : [ '直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎' ]
						}, */
						grid : {
							y2: 140
						},
						xAxis : {
							type : 'category',
							name : '投标人',
							data : [ '' ],
							axisLabel:{
							     interval:0,//横轴信息全部显示
							     rotate:-30,//-30度角倾斜显示
							}
						},
						yAxis : {
							type : 'value',
							name : '金额:万元',
						},
						series: [{
							name : '万元',
							type : 'bar',
							stack : '万元',
							label : {
								normal : {
									show : true,
									position: 'top',
									formatter:function(a,b,c){
										var result = [ ], counter = 0;
										var num_array = a.data.split('.');
										var num = num_array[0];
										var newstr = '';
									    for (var i = num.length - 1; i >= 0; i--) {
									        counter++;
									        result.unshift(num[i]);
									        if (!(counter % 3) && i != 0) { result.unshift(','); }
									    }
									    if(num_array.length>1){
									    	newstr = result.join('');
									    	newstr += '.'+num_array[1];
									    	return newstr;
									    }else{
									     	return result.join('');
									    }
								  	},
								},
							},
							data : [ '' ],
							color:['#0087ED'],
							itemStyle: {
								normal: {
								barBorderRadius: 5,
								}
							},
							barWidth: 30,
						}]
					};
				myChart3.setOption(options3);
				//获得图表的options对象  
				var newOption3 = myChart3.getOption();
				//参数
				var startDate = $("#begin3").val();
				var endDate = $("#end3").val();
				var type = $("#jylx-type3").val();
				if(type==null || type=="" || type=="undefine"){
		        	type = "${type}";
		        }
				var centerCode = $("#jyzx-all3").val();
				 //ajax方式获取投标人中标金额统计分析柱状图的数据
			   	$.ajax({  
			        type : "post",  
			        async : true, //异步执行  
			        url : "bidder!zbjeBar.do",  
			        data : {startDate: startDate, endDate: endDate, type: type,centerCode:centerCode},  
			        dataType : "json", //返回数据形式为json  
					success : function(data) {
						if (data) {
							newOption3.xAxis[0].data = data.category;
							newOption3.series[0].data = data.series;
							myChart3.hideLoading();
							myChart3.setOption(newOption3);
						}
					},
					error : function(errorMsg) {
						alert("图表请求数据失败啦!");
						myChart3.hideLoading();
					}
				}); 
			}
			//根据查询条件加载柱图
			function showChart3() {
				getChartData3();
			}
			</script>

=======2016/12/6补充

获取的价格分为两种格式,一种获取的时候就带有"."小数点2位,一种是直接整数的形式展示,但是也要就是千位符的截取,上面讲解的是带有小数点的,下面是没有小数点的。
var options5 = {
						title: {
				            text: '中标价格区间偏好分析',
				            x : 'center',
				           // textAlign:'center',
// 				            padding: [
// 			                     10,  // 上
// 			                     0, // 右
// 			                     0,  // 下
// 			                     300, // 左
// 			                ],
			                textStyle: {
			               		color: '#000000'
			               	},
				        },
				        toolbox: {
					        show : true,
					        x:'850',//下载的字体显示不全
					        feature : {
					            dataView : {show: false, readOnly: false},
					            magicType : {show: true, type: ['line', 'bar']},
					           // restore : {show: true},
					            saveAsImage : {show: true}
					        }
					    },
						tooltip : {
							trigger : 'axis',
							axisPointer : { // 坐标轴指示器,坐标轴触发有效
								type : 'shadow' // 默认为直线,可选为:'line' | 'shadow'
							}
						},
						/* legend : {
							data : [ '直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎' ]
						}, */
						grid : {
							left : '1%',
							right : '10%',
							bottom : '3%',
							containLabel : true
						},
						xAxis : {
							type : 'category',
							//x:'450',
							name : '单位:万元',
							data : [ '' ],
							axisLine:{
		                        lineStyle:{
		                            color:'#AE5DA0',
		                            width:1,//这里是为了突出显示加上的
		                        }
		                    }
						},
						yAxis : {
							type : 'value',
							name : '单位:次',
							splitLine: {
							    lineStyle: {
							        // 使用深浅的间隔色
							        color: ['#AE5DA0']
							    }
							},
							nameTextStyle: {
								color: ['#AE5DA0']
								},
							axisLine:{
		                        lineStyle:{
		                            color:'#AE5DA0',
		                            width:1,//这里是为了突出显示加上的
		                        }
		                    }



							
						},
						series : [ {
								name : '中标次数',
								type : 'bar',
								stack : '总量',
								label : {
									normal : {
										show : true,
										position: 'top',
										 formatter:function(a,b,c){
												var result = [ ], counter = 0;
												var num_array = a.data.toFixed(2).split('.');
												var num = num_array[0];
												var newstr = '';
											    for (var i = num.length - 1; i >= 0; i--) {
											        counter++;
											        result.unshift(num[i]);
											        if (!(counter % 3) && i != 0) { result.unshift(','); }
											    }
											    return result.join('');
											    if(num_array.length>1){
											    	newstr = result.join('');
											    	newstr += '.'+num_array[1];
											    	return newstr;
											    }else{
											     	return result.join('');
											    }
										  	}, 
									}
								},
								data : [ '' ],
								color:['#AE5DA0'],
								itemStyle: {
									normal: {
									barBorderRadius: 5,
									}
								},
								barWidth: 30
							}
						]
					};

注:关键点在var num_array = a.data.toFixed(2).split('.');上,其中 a.data.toFixed(2)是给数据加上小数点并给数据添加小数点后两位数。


  • 2
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值