app.title = '堆叠柱状图';

option = {
tooltip : {
trigger: 'axis',
axisPointer : { // 坐标轴指示器,坐标轴触发有效
type : 'shadow' // 默认为直线,可选为:'line' | 'shadow'
},
formatter:'{b}<br />\
<span style="display:inline-block;margin-right:5px;border-
radius:10px;width:9px;height:9px;background-color:#7ace4c"></span>\
{a0}:{c0}%<br />\
<span style="display:inline-block;margin-right:5px;border-
radius:10px;width:9px;height:9px;background-color:#ffbb44"></span>\
{a1}:{c1}%<br />\
<span style="display:inline-block;margin-right:5px;border-
radius:10px;width:9px;height:9px;background-color:#11a0f8"></span>\
{a2}:{c2}%<br />'
},
legend: {
data:['未完成','已完成','实际完成']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis : [
{
type : 'category',
data : ['total','A','B','C','D','E','F']
}
],
yAxis : [
{
type : 'value'
}
],
series : [ {
name:'未完成',
type:'bar',
stack: '广告',
data:[120, 132, 101, 134, 90, 230, 210]
},
{
name:'已完成',
type:'bar',
stack: '广告',
data:[220, 182, 191, 234, 290, 330, 310]
},
{
name:'实际完成',
type:'bar',
data:[320, 332, 301, 334, 390, 330, 320]
}
]
};

Echarts X轴多项百分比的展示的更多相关文章

  1. [置顶] echarts x轴文字显示不全(xAxis文字倾斜比较全面的3种做法值得推荐)

    echarts x轴标签文字过多导致显示不全 如图: 解决办法1:xAxis.axisLabel 属性 axisLabel的类型是object ,主要作用是:坐标轴刻度标签的相关设置.(当然yAxis ...

  2. echarts x轴文字显示不全(解决方案)

    echarts x轴标签文字过多导致显示不全 如图: 解决办法1:xAxis.axisLabel 属性 axisLabel的类型是object ,主要作用是:坐标轴刻度标签的相关设置.(当然yAxis ...

  3. echarts x轴标签文字过多导致显示不全

    原文电梯:https://blog.csdn.net/kebi007/article/details/68488694 echarts x轴标签文字过多导致显示不全 如图: 解决办法1:xAxis.a ...

  4. echarts x轴文字显示不全解决办法

    标题:echarts x轴文字显示不全(xAxis文字倾斜比较全面的3种做法值得推荐):http://blog.csdn.net/kebi007/article/details/68488694

  5. echarts x轴名称太长

    echarts x轴名称太长了,隐藏一部分,鼠标移到名称上,显示全称 function extension(mychart, type) { let extension = document.getE ...

  6. echarts Y轴名称显示不全(转载)

    转载来源:https://blog.csdn.net/qq8241994/article/details/90720657今天在项目的开发中遇到的一个问题,echarts Y轴左侧的文字太多了,显示不 ...

  7. echarts 让轴自适应数据为小数整数

    echarts 让轴自适应数据为小数整数,以解决y轴数值重复的问题 工作中突然遇到这个问题 试了一下用formatter自适应  ok  在yAxis中提阿尼按键属性 axisLabel 1 axis ...

  8. Chart.js Y轴数据以百分比展示

    新手一枚,解决的问题喜欢记录,也许正好有人在网上迷茫的百度着.-0- 最近使用Chart.js做折线图的报表展示,直接显示整数啥的很好弄毕竟例子直接在哪里可以用,百分比就没办法了.百度慢慢汲取营养,虽 ...

  9. Echarts X轴内容过长自动隐藏,鼠标移动上去显示全部名称方法

    最近公司做项目,使用echarts做开发,碰到一些数据的名称很长导致图例展示的效果不是很好,自己写了一个方法,当X轴内容过长时自动隐藏,鼠标移动上去显示全部名称 样例: 图二是鼠标移动到名称显示的,怎 ...

随机推荐

  1. 如何开启telnet服务LINUX&Windows

    一.LINUX centos 1.Linux安装telnet包 # yum install telnet* # rpm -qa |grep telnet telnet-server-0.17-47.e ...

  2. Lua语法要点2

    [Lua语法要点2] 1.Lua函数 function 可以添加 local 关键字.添加后为局部函数,不添加(默认)为全局函数.return 可以返回多个返回值,以, 分隔. 使用 ... 来表示变 ...

  3. Java 获取对象全部属性 包括 父类属性

    今天由于业务需要,看一段数据库中的表转化成用户可以看懂的数据,也就是把一些字段比如Date用ms存的,转化为'yyyy-MM-dd'这种格式,但是由于字段太多,所以利用Java反射机制自带的BeanU ...

  4. django admin 编辑页面(change page) 自定义字段, 展示数据

    最近遇到一个需求, 需要在django 的 admin 编辑页内展示由用户上传的进行反馈的图片, 还要支持点击查看原图, 所以需要在编辑页内自定义 img 标签及 a 标签进行图片的展示及点击跳转 i ...

  5. Tinkoff Internship Warmup Round 2018 and Codeforces Round #475 (Div. 1)

    A. Alternating Sum 就是个等比数列,特判公比为 $1$ 的情况即可. #include <bits/stdc++.h> using namespace std; ; ; ...

  6. 【myBatis】It's likely that neither a Result Type nor a Result Map was specified.

    因为mapper.xml里把resultType写成了parameterType

  7. OpenCV 学习笔记(15)openc解帧视频

    1 修改读取视频的地址 2 修改保存图片序列的路径 String videopath = "F:/dongdong/0tool/3D/2模型/相机阵列/1_12cam亿级相机/数据/giga ...

  8. [PHP] PHP汉字转拼音的方法

    PHP汉字转拼音的方法 代码如下: <?php // 此类是依据ASCII码转换,GB2312库对多音字也无能为力. // GB2312标准共收录6763个汉字,不在范围内的汉字是无法转换,如: ...

  9. axios post方式请求x-ww格式的数据

    //使用axios时,要确定是json格式还是x-www格式的,axios默认是json格式的,如果是x-ww格式需要做如下配置: let url = "/hehe/site/getcomm ...

  10. haproxy 配置文件详解 之 frontend

    配置示例: frontend www bind *: mode http option httplog option forwardfor option httpclose log global #a ...