返回总目录页

echarts饼图详细+仪表盘

echarts(数据可视化图表)

标签属性

标签属性:label模板字符串显示name和value

未使用之前,系列的name默认就显示在外面了,显示的是name

 

 系列里面有系列的类型,数据,label标签。数据就是一个列表,列表元素是字典,一个字典代表饼图的一个扇区的数据,一个数据就有name,和value。

系列的标签设置:如下,a代表啥不清楚,b代表数据里的name,c代表数据里的value,d代表数据里的value的占比。formatter可以控制显示哪些内容。position代表显示在图内还是图外,inside和outside。

 

 如下,a代表系列的名称。系列在pandas里面就是一列数据,这里貌似类似,我们这里相当于data里面一个字典就代表一个单元格数据,name相当于行标题,一列就不需要标题了,只要对应数值就行,貌似这样理解也行。标签就是对每个数据单元的标签描述、信息

 

 饼图实现系列data的name value在图外,百分比在图内

 

 

option = {
  series: [
      {
        type: 'pie',
        radius: '90%',
        label: {            //饼图图形上的文本标签
            show: true,
            position: 'outside', //标签的位置
            textStyle: {
              fontWeight: 300,
              fontSize: 14    //文字的字体大小
            },
            formatter: function (d) {
              console.log(d);
              return d.name+"\n"+d.value+"公里"
            }
        },
        data: [
          { value: 484, name: '左幅' },
          { value: 300, name: '右幅' }
        ],
        emphasis: {
          itemStyle: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(0, 0, 0, 0.5)'
          }
        }
      },



      {
        type: 'pie',
        radius: '90%',
        label: {            //饼图图形上的文本标签
            show: true,
            position: 'inside', //标签的位置
            textStyle: {
              fontWeight: 300,
              fontSize: 16    //文字的字体大小
            },
            formatter: function (d) {
              return Math.round(d.percent) + '%'
            }
        },
        data: [
          { value: 484, name: '左幅' },
          { value: 300, name: '右幅' }
        ],
        emphasis: {
          itemStyle: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(0, 0, 0, 0.5)'
          }
        }
      }

    ]
};
option = {
  series: [
      {
        type: 'pie',
        radius: '90%',
        label: {            //饼图图形上的文本标签
            show: true,
            position: 'outside', //标签的位置
            textStyle: {
              fontWeight: 300,
              fontSize: 14    //文字的字体大小
            },
            formatter: function (d) {
              console.log(d);
              return d.name+"\n"+d.value+"公里"
            }
        },
        data: [
          { value: 484, name: '左幅' },
          { value: 300, name: '右幅' }
        ],
        emphasis: {
          itemStyle: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(0, 0, 0, 0.5)'
          }
        }
      },



      {
        type: 'pie',
        radius: '90%',
        label: {            //饼图图形上的文本标签
            show: true,
            position: 'inside', //标签的位置
            textStyle: {
              fontWeight: 300,
              fontSize: 16    //文字的字体大小
            },
            formatter: function (d) {
              return Math.round(d.percent) + '%'
            }
        },
        data: [
          { value: 484, name: '左幅' },
          { value: 300, name: '右幅' }
        ],
        emphasis: {
          itemStyle: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(0, 0, 0, 0.5)'
          }
        }
      }

    ]
};

当我们想要添加一个数据时,如下在两个data上共添加两行

效果:

 

 程序:

option = {
  series: [
      {
        type: 'pie',
        radius: '90%',
        label: {            //饼图图形上的文本标签
            show: true,
            position: 'outside', //标签的位置
            textStyle: {
              fontWeight: 300,
              fontSize: 14    //文字的字体大小
            },
            formatter: function (d) {
              console.log(d);
              return d.name+"\n"+d.value+"公里"
            }
        },
        data: [
          { value: 484, name: '左幅' },
          { value: 300, name: '右幅' },
          { value: 300, name: '魔降风云变' },
        ],
        emphasis: {
          itemStyle: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(0, 0, 0, 0.5)'
          }
        }
      },



      {
        type: 'pie',
        radius: '90%',
        label: {            //饼图图形上的文本标签
            show: true,
            position: 'inside', //标签的位置
            textStyle: {
              fontWeight: 300,
              fontSize: 16    //文字的字体大小
            },
            formatter: function (d) {
              return Math.round(d.percent) + '%'
            }
        },
        data: [
          { value: 484, name: '左幅' },
          { value: 300, name: '右幅' },
      { value: 300, name: '魔降风云变' },
        ],
        emphasis: {
          itemStyle: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(0, 0, 0, 0.5)'
          }
        }
      }

    ]
};

 图形标题居中和图例靠右的设置

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <!-- 引入刚刚下载的 ECharts 文件 -->
    <script src="echarts.min.js"></script>
    <script src="echarts-liquidfill.js"></script>
  </head>
<body>
  <!-- 为 ECharts 准备一个定义了宽高的 DOM -->
  <div id="main" style="width: 600px;height:400px;background-color: gainsboro;"></div>

</body>
    <script type="text/javascript">
      // 基于准备好的dom,初始化echarts实例
      var myChart = echarts.init(document.getElementById('main'));

      // 指定图表的配置项和数据

option ={
    title: {
        text: '上云业务系统分类占比',
        left: 'center',
    },
      legend: {
        left: 'right',
        top: '10',
        orient: 'vertical',
        data:['直接访问', '联盟广告','搜索引擎']
    },
  series: [
    {
      type: 'pie',      //type为pie,表示图表为饼图
      data: [
        {
          value: 335,
          name: '直接访问'
        },
        {
          value: 234,
          name: '联盟广告'
        },
        {
          value: 1548,
          name: '搜索引擎'
        }
      ]
    }
  ]
};
      // 使用刚指定的配置项和数据显示图表。
      myChart.setOption(option);
    </script>
</html>

设置之前没有的

 

 如下,标题和图例。图例距离上面10px,有vertical,那么就竖直排图例,不然就是横着排在一行

 echarts  grid画布属性

myChart.setOption({  
       option: {
           title: {
                    text: 'ECharts 入门示例'
           },
    
       //设置canvas内部表格的内距
           grid:{
                  x:50,
                  y:50,
                  x2:50,
                  y2:60,
                  borderWidth:10
           }
                ....

grid配置项:图标离容器的距离
show:是否显示直角坐标系网格-----------值:true?false
left:图表离容器左侧的距离-----------------值:number?百分比
top:图表离容器顶部的距离-----------------值:number?百分比
right:图表离容器右侧的距离---------------值:number?百分比
bottom:图表离容器底部的距离------------值:number?百分比
backgroundColor:网格背景色-------------值:rgba或#000000
borderColor:网格的边框颜色--------------值:rgba或#000000
borderWidth:网格的边框线宽-------------值:number
备注:背景色-边框-线宽生效前提:设置了show:true,边距不受show影响

 

grid: {
    show:true,
    left: "5%",
    top: "5%",
    right: "5%",
    bottom: "5%"
    backgroundColor: "rgba(224, 17, 17, 1)"
    borderColor: "rgba(96, 67, 67, 1)"
},

 

 echarts title属性

    option = {
        title: {  //标题组件
            show: true, //是否显示标题组件  默认true
            text: "主标题",
            link: "", //主标题超链接
            textStyle: { //主标题样式
                color: "rgba(0,0,0,1)",
                fontStyle: "normal", //字体样式-倾斜 normal italic oblique
                fontWeight: "normal", //字体粗细 bold lighter 400 500
                fontFamily: "", //字体风格 黑体 楷体 宋体
                fontSize: 12, //字体大小
                lineHeight: "20", //行高
                width: "20", //宽度
                height: "20", //高度
                textBorderColor: "rgba(0,0,0,1)", //文字描边颜色
                textBorderWidth: "2", //文字描边宽度
                textBorderType: "solid", //文字描边类型 直线solid 虚线dotted 后面还有很多
                rich: {}, //自定义富文本样式
            },
            subtext: "副标题",
            sublink: ""//副标题超链接
            subtextStyle: {}, //副标题样式 
            textAlign: "", //标题的水平对齐 auto left right center
            textVerticalAlign: "", //标题垂直对齐 auto top bottom middle
            padding: [1, 1, 1, 1], //标题内边距
            itemGap: 10, //主副标题之间的间距
            z: 999, //标题的层级
            top: '', bottom: '', left: '', right: '', //title组件距离容器的距离
            backgroundColor: 'red', //标题背景颜色
            borderColor: 'yellow', //标题边框颜色
            borderWidth: 2, //标题边框现款
            borderRadius: 5, //标题边框圆角
            //shadow 阴影属性
        }
    }

echarts liquidFill 配置说明

{
    data: [],
 
    color: ['#294D99', '#156ACF', '#1598ED', '#45BDFF'],
    center: ['50%', '50%'],
    radius: '50%',
    amplitude: '8%', // 波浪的振幅,可设置为像素值或百分比,其中百分比是相对图的直径
    waveLength: '80%',
    phase: 'auto', // 波浪的相位
    period: 'auto', // 向前移动一个波长所需的毫秒数
    direction: 'right', //波浪滚动的方向
    shape: 'circle', // 波浪形状,可被设置为'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow' 或者 svg路径
 
    waveAnimation: true,   // 是否开启波浪动画
    animationEasing: 'linear', //当波浪从底部开始上升时,初始动画的简化方法。
    animationEasingUpdate: 'linear', // 其他动画的简化方法,例如,当数据值改变及波位改变时。
    animationDuration: 2000, // 动画持续时间,单位为毫秒
    animationDurationUpdate: 1000, // 数据更新动画持续时间
 
    outline: {
        show: true,
        borderDistance: 8,
        itemStyle: {
            color: 'none',
            borderColor: '#294D99',
            borderWidth: 8,
            shadowBlur: 20,
            shadowColor: 'rgba(0, 0, 0, 0.25)'
        }
    },
 
    backgroundStyle: {
        color: '#E3F7FF'
    },
 
    itemStyle: {
        opacity: 0.95,
        shadowBlur: 50,
        shadowColor: 'rgba(0, 0, 0, 0.4)'
    },
 
    label: {
        show: true,
        color: '#294D99',
        insideColor: '#fff',
        fontSize: 50,
        fontWeight: 'bold',
 
        align: 'center',
        baseline: 'middle'
        position: 'inside'
    },
 
    emphasis: {
        itemStyle: {
            opacity: 0.8
        }
    }
}

 

仪表盘

仪表盘案例1和介绍

https://echarts.apache.org/examples/zh/editor.html?c=gauge-temperature

option = {
  series: [
    {
      type: 'gauge',
      startAngle: 180,
      endAngle: 0,
      center: ['50%', '75%'],
      radius: '90%',
      min: 0,
      max: 2300,
      splitNumber: 10,
      axisLine: {
        lineStyle: {
          width: 6,
          color: [
            [0.25, '#FF6E76'],
            [0.5, '#FDDD60'],
            [0.75, '#58D9F9'],
            [1, '#7CFFB2']
          ]
        }
      },
      pointer: {
        icon: 'path://M12.8,0.7l12,40.1H0.7L12.8,0.7z',
        length: '12%',
        width: 20,
        offsetCenter: [0, '-60%'],
        itemStyle: {
          color: 'inherit'
        }
      },
      axisTick: {
        length: 12,
        lineStyle: {
          color: 'inherit',
          width: 2
        }
      },
      splitLine: {
        length: 20,
        lineStyle: {
          color: 'inherit',
          width: 5
        }
      },
      axisLabel: {
        color: '#464646',
        fontSize: 20,
        distance: -60,
        rotate: 'tangential',
        formatter: function (value) {
          return value
          if (value === 100) {
            return '100';
          } else if (value === 200) {
            return '200';
          } else if (value === 300) {
            return 'Grade C';
          } else if (value === 0.125) {
            return 'Grade D';
          }
          return '';
        }
      },
      title: {
        offsetCenter: [0, '-10%'],
        fontSize: 20
      },
      detail: {
        fontSize: 30,
        offsetCenter: [0, '-35%'],
        valueAnimation: true,
        formatter: function (value) {
          return Math.round(value * 1) + '';
        },
        color: 'inherit'
      },
      data: [
        {
          value: 1000.0,
          name: 'CPU 总2345核,已分配1000核,利用率50%'
        }
      ]
    }
  ]
};
仪表盘源码

基础仪表盘,设置最大值,切割数字10,这样看起来整体很合理。

 

 得要return值,才能显示刻度值 

 

 data里面定义value,其它地方使用value,详情属性格式里面返回仪表盘中间的数据,是value做过处理的数据,data里面的name,就是定义仪表盘下面的文字信息

 

 下面这个调整刻度标签,在仪表盘内是正数,在仪表盘外就是负数,绝对值越大,离仪表盘边越远

 

 这个是这个线的宽度,其它的宽度,比如有指针的宽度,有切割线的宽度

 通过radius,调整仪表盘半径,让仪表盘变大,占满div。此时半径大于div的高度,仪表盘上面被隐藏。这是我们不需要1/2圆,可以通过startAngle和endAngle来调整扇区对应的弧线。如果是半圆弧形,那么是从180度开始,从0度结束的,根据实际需要,填写开始和结束,截取需要的弧度。这样就出来想要的了。虽然不是半椭圆,但是这个弧形的就可以了。因为选定弧形之后,这部分弧形不是在div的中间展示,我们通过调整center,来把弧形调整到如下图div的中间展示。50%是x方向,x方向一般这个50%就能水平方向居中了,120%是y方向

 

 

案例2有定时加载变化的数,设置样式变量

<div id="main" style="width: 400px;height: 300px;"></div>
        <script>
            var myChart = echarts.init(document.getElementById("main"));
            option = {
                //提示框组件。开发实际中去掉了指针,提示框可以不用设置。
                tooltip: {
                    formatter: "{a} <br/>{b} : {c}%"
                },
                //工具栏。本次好像也没用到,刷新,下载,我觉得还是挺实用的,具体开需求!
                toolbox: {
                    feature: {
                        restore: {},
                        saveAsImage: {}
                    }
                },
                //下面属性才是仪表盘的核心!!反正我是这么认为的!!!
                series: [{
                    //类型
                    type: 'gauge',
                    //半径
                    radius: 150,
                    //起始角度。圆心 正右手侧为0度,正上方为90度,正左手侧为180度。
                    startAngle: 180,
                    //结束角度。
                    endAngle: 0,
                    center: ['50%', '90%'],
                    //仪表盘轴线相关配置。
                    axisLine: {
                        show:true,
                        // 属性lineStyle控制线条样式
                        lineStyle: {
                            width: 60,
                            color:[[1, '#63869e']]
                        }
                    },
                    //分隔线样式。
                    splitLine: {
                        show: false,
                    },
                    //刻度样式。
                    axisTick: {
                        show: false,
                    },
                    //刻度标签。
                    axisLabel: {
                        show:false,
                    },
                    //仪表盘指针。
                    pointer: {
                        //这个show属性好像有问题,因为在这次开发中,需要去掉指正,我设置false的时候,还是显示指针,估计是BUG吧,我用的echarts-3.2.3;希望改进。最终,我把width属性设置为0,成功搞定!
                        show: false,
                        //指针长度
                        length:'90%',
                        width:0,
                    },
                    //仪表盘标题。
                    title: {
                        show: true,
                        offsetCenter: [0, '-40%'], // x, y,单位px
                        textStyle: {
                            color: '#hhh',
                            fontSize: 30
                        }
                    },
                    //仪表盘详情,用于显示数据。
                    detail: {
                        show: true,
                        offsetCenter: [0, '-10%'],
                        formatter: '{value}%',
                        textStyle: {
                            fontSize: 30
                        }
                    },
                    data: [{
                        value: 0,
                        name: '存储量'
                    }]
                }]
            };
            myChart.setOption(option);
            //设置定时,加载随机数据,可以直观显示
            timeTicket = setInterval(function() {
                var random=(Math.random() * 100).toFixed(2);
                var color=[[random/100, '#63869e'], [1, '#c23531']];
                option.series[0].axisLine.lineStyle.color=color;
                option.series[0].data[0].value =random ;
                myChart.setOption(option, true);
            }, 200)
        </script>

仪表盘属性详解

var option = {
 
backgroundColor: "#000",
 
tooltip: { // 本系列特定的 tooltip 设定。
 
show: true,
 
formatter: "{b}:{c}%",
 
backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色。注意:series.tooltip 仅在 tooltip.trigger 为 'item' 时有效。
 
borderColor: "#333", // 提示框浮层的边框颜色。...
 
borderWidth: 0, // 提示框浮层的边框宽。...
 
padding: 5, // 提示框浮层内边距,单位px,默认各方向内边距为5,接受数组分别设定上右下左边距。...
 
textStyle: { // 提示框浮层的文本样式。...
 
// color ,fontStyle ,fontWeight ,fontFamily ,fontSize ,lineHeight ,.......
 
},
 
},
 
series: [
 
{
 
name: "单仪表盘示例", // 系列名称,用于tooltip的显示,legend 的图例筛选,在 setOption 更新数据和配置项时用于指定对应的系列。
 
type: "gauge", // 系列类型
 
radius: "80%", // 参数:number, string。 仪表盘半径,默认 75% ,可以是相对于容器高宽中较小的一项的一半的百分比,也可以是绝对的数值。
 
center: ["50%", "55%"], // 仪表盘位置(圆心坐标)
 
startAngle: 225, // 仪表盘起始角度,默认 225。圆心 正右手侧为0度,正上方为90度,正左手侧为180度。
 
endAngle: -45, // 仪表盘结束角度,默认 -45
 
clockwise: true, // 仪表盘刻度是否是顺时针增长,默认 true。
 
min: 0, // 最小的数据值,默认 0 。映射到 minAngle。
 
max: 100, // 最大的数据值,默认 100 。映射到 maxAngle。
 
splitNumber: 10, // 仪表盘刻度的分割段数,默认 10。
 
axisLine: { // 仪表盘轴线(轮廓线)相关配置。
 
show: true, // 是否显示仪表盘轴线(轮廓线),默认 true。
 
lineStyle: { // 仪表盘轴线样式。
 
color: colorTemplate1, //仪表盘的轴线可以被分成不同颜色的多段。每段的 结束位置(范围是[0,1]) 和 颜色 可以通过一个数组来表示。默认取值:[[0.2, '#91c7ae'], [0.8, '#63869e'], [1, '#c23531']]
 
opacity: 1, //图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。
 
width: 30, //轴线宽度,默认 30。
 
shadowBlur: 20, //(发光效果)图形阴影的模糊大小。该属性配合 shadowColor,shadowOffsetX, shadowOffsetY 一起设置图形的阴影效果。
 
shadowColor: "#fff", //阴影颜色。支持的格式同color。
 
}
 
},
 
splitLine: { // 分隔线样式。
 
show: true, // 是否显示分隔线,默认 true。
 
length: 30, // 分隔线线长。支持相对半径的百分比,默认 30。
 
lineStyle: { // 分隔线样式。
 
color: "#eee", //线的颜色,默认 #eee。
 
opacity: 1, //图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。
 
width: 2, //线度,默认 2。
 
type: "solid", //线的类型,默认 solid。 此外还有 dashed,dotted
 
shadowBlur: 10, //(发光效果)图形阴影的模糊大小。该属性配合 shadowColor,shadowOffsetX, shadowOffsetY 一起设置图形的阴影效果。
 
shadowColor: "#fff", //阴影颜色。支持的格式同color。
 
}
 
},
 
axisTick: { // 刻度(线)样式。
 
show: true, // 是否显示刻度(线),默认 true。
 
splitNumber: 5, // 分隔线之间分割的刻度数,默认 5。
 
length: 8, // 刻度线长。支持相对半径的百分比,默认 8。
 
lineStyle: { // 刻度线样式。
 
color: "#eee", //线的颜色,默认 #eee。
 
opacity: 1, //图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。
 
width: 1, //线度,默认 1。
 
type: "solid", //线的类型,默认 solid。 此外还有 dashed,dotted
 
shadowBlur: 10, //(发光效果)图形阴影的模糊大小。该属性配合 shadowColor,shadowOffsetX, shadowOffsetY 一起设置图形的阴影效果。
 
shadowColor: "#fff", //阴影颜色。支持的格式同color。
 
},
 
},
 
axisLabel: { // 刻度标签。
 
show: true, // 是否显示标签,默认 true。
 
distance: 5, // 标签与刻度线的距离,默认 5。
 
color: "#fff", // 文字的颜色,默认 #fff。
 
fontSize: 12, // 文字的字体大小,默认 5。
 
formatter: "{value}", // 刻度标签的内容格式器,支持字符串模板和回调函数两种形式。 示例:// 使用字符串模板,模板变量为刻度默认标签 {value},如:formatter: '{value} kg'; // 使用函数模板,函数参数分别为刻度数值,如formatter: function (value) {return value + 'km/h';}
 
},
 
pointer: { // 仪表盘指针。
 
show: true, // 是否显示指针,默认 true。
 
length: "70%", // 指针长度,可以是绝对数值,也可以是相对于半径的百分比,默认 80%。
 
width: 5, // 指针宽度,默认 8。
 
},
 
itemStyle: { // 仪表盘指针样式。
 
color: "auto", // 指针颜色,默认(auto)取数值所在的区间的颜色
 
opacity: 1, // 图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形。
 
borderWidth: 0, // 描边线宽,默认 0。为 0 时无描边。
 
borderType: "solid", // 柱条的描边类型,默认为实线,支持 'solid', 'dashed', 'dotted'。
 
borderColor: "#000", // 图形的描边颜色,默认 "#000"。支持的颜色格式同 color,不支持回调函数。
 
shadowBlur: 10, // (发光效果)图形阴影的模糊大小。该属性配合 shadowColor,shadowOffsetX, shadowOffsetY 一起设置图形的阴影效果。
 
shadowColor: "#fff", // 阴影颜色。支持的格式同color。
 
},
 
emphasis: { // 高亮的 仪表盘指针样式
 
itemStyle: {
 
//高亮 和正常 两者具有同样的配置项,只是在不同状态下配置项的值不同。
 
}
 
},
 
title: { // 仪表盘标题。
 
show: true, // 是否显示标题,默认 true。
 
offsetCenter: [0,"20%"],//相对于仪表盘中心的偏移位置,数组第一项是水平方向的偏移,第二项是垂直方向的偏移。可以是绝对的数值,也可以是相对于仪表盘半径的百分比。
 
color: "#fff", // 文字的颜色,默认 #333。
 
fontSize: 20, // 文字的字体大小,默认 15。
 
},
 
detail: { // 仪表盘详情,用于显示数据。
 
show: true, // 是否显示详情,默认 true。
 
offsetCenter: [0,"50%"],// 相对于仪表盘中心的偏移位置,数组第一项是水平方向的偏移,第二项是垂直方向的偏移。可以是绝对的数值,也可以是相对于仪表盘半径的百分比。
 
color: "auto", // 文字的颜色,默认 auto。
 
fontSize: 30, // 文字的字体大小,默认 15。
 
formatter: "{value}%", // 格式化函数或者字符串
 
},
 
data: data1
 
}
 
]
 
};

如果仪表盘中间的数字字体显示不同的样式,把detail里面的设置改一下

detail: {
              valueAnimation: true, //
              animationThreshold:1100,//当大于这个阀值关闭动画
              width: '60%',              //
              lineHeight: 0,             //行高
              offsetCenter: ['2%', '10%'],  //中间显示文字的位置
              color: '#3866FF',                //颜色
              formatter: function(value) {
                return '{value|' + value.toFixed(0) + '}{unit|M}'
              },                             //动态设置不同文字的样式
              rich: { //特定样式
                value: {
                  fontSize: 25, //字体大小
                  fontWeight: 'bolder', //是否加粗
                },
                unit: {
                  fontSize: 16,
                  fontWeight: 'bolder',
                    padding: [0, 0, -2, 0],//调整位置
                }
              },
            },

 

posted @ 2022-10-26 13:05  马昌伟  阅读(2261)  评论(0编辑  收藏  举报
博主链接地址:https://www.cnblogs.com/machangwei-8/