echarts 柱状图成交金额数字格式化

浪淘沙2年前前端805
<div id="main"></div>    
<script type="text/javascript">    
var myChart = echarts.init(document.getElementById('main'));    
var option = {    
grid: {    
x: 80,    
x2: 10,    
y2: 100,    
borderWidth: 1    
},    
title: {    
text: '最近30天每日成交金额',    
left: 'center'    
},    
tooltip: {    
trigger: 'axis',    
formatter: function (params) {    
return params[0].seriesName + '<br/>' +    
params[0].name + ': ' + params[0].value.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,') + ' 元';    
}    
},    
xAxis: {    
type: 'category',    
axisLabel: { alignWithLabel: true, rotate: -90 },    
axisPointer: {    
type: 'shadow'    
},    
data: ['2024/8/22 ','2024/8/21 ','2024/8/20 ','2024/8/19 ','2024/8/18 ','2024/8/17 ','2024/8/16 ','2024/8/15 ','2024/8/14 ','2024/8/13 ','2024/8/12 ',]    
},    
yAxis: {    
type: 'value'    
},    
series: [{    
name: '金额',    
type: 'bar',    
label: {    
normal: {    
show: true,    
position: 'top',    
formatter: function (params) {    
// 格式化金额,保留两位小数,并添加千分位分隔符    
return params.value.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,');    
}    
}    
},    
data: [156000.01,67960,280,13680,14240,16110,26520,80320,23920,59800,760,]    
}]    
};    
myChart.setOption(option);    
</script>


相关文章

element puls select 表单验证

后端: public record OptionItem(string Label, string Value);  publi...

echarts 柱子包含关系

echarts 柱子包含关系

<div id="zy" style="width: 100%; height: 900px;">...

layui table后端接口html代码,前端显示

  , { field: 'dwbq', title: '单位标签', width:&n...

layui 为CKEditor 4 赋值 经常不显示

 // 在编辑器初始化后赋值  setTimeout(function() {   CKEDITOR.instances[...

layui form提交时,弹出确认框

layui form提交时,弹出确认框

<div class="container yx-form">     <form c...

element 调用接口返回json中的data-bs-toggle="tooltip" data-bs-title="查阅"

<el-table ref="tableRef"><el-table-column prop="files" label=...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。