柱状图多维条形图vue_vue-echar 条形图(含底部滑动、图表自适应)

该博客展示了如何使用Vue和ECharts实现营销线各部门接口录入统计的柱状图,包括底部滑动和图表自适应功能。通过 Axios 获取数据,动态渲染ECharts图表,详细解释了代码实现过程,并提供了关于图表在不同场景下自适应的解决方案。
摘要由CSDN通过智能技术生成

营销线-各部门接口录入统计

拼命计算中...

var bar=0

var line="||"

var amount="||"

count()

function count(){

bar=bar+2

amount =amount + line

document.loading.chart.value=amount

document.loading.percent.value=bar+"%"

if (bar<99){

setTimeout("count()",1200);

}else{

document.getElementById("hh").style.display = "none";

document.getElementById("hh2").style.display = "block";

}

}

axios.get('/test_request_sum2')

.then(function (response) {

console.log(response.data);

var b=response.data["proname"]

var b2=response.data["proSum"]

var b3=response.data["bigname"]

var b4=response.data["bignum"]

var b5=response.data["zongshu"]

document.getElementById("zongshu").innerHTML ='当前总录入接口: '+b5;

document.getElementById("hh").style.display = "none";

document.getElementById("hh2").style.display = "block";

// var b=['效能中台--营销线', '效能中台-定制课电销', '定制课--上课系统', '数字化-投放工作台', 'B端--AI双师', 'B端--等考', 'B端--比赛', 'B端--未来教室', '数字化-外部账号', '效能中台--转介绍', '新零售--谷雨平台', '效能中台-定制课班主任', 'B端--B2C', '数字化-交易系统管理后台', '数字化-内部账号系统', '数字化-权限系统', '数字化-财务系统', '定制课--老师端', '定制课--教务端']

// var b2=[26, 112, 12, 112, 71, 17, 10, 54, 42, 31, 69, 61, 26, 3, 10]

// var b3=["定制课-", "新零售-", "效能中台", "数字化-", "B端--"]

// var b4=[12, 69, 230, 167, 178]

// 基于准备好的dom,初始化echarts实例

var myChart = echarts.init

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值