zoukankan      html  css  js  c++  java
  • Echarts实战案例代码:饼图pie之南丁格尔玫瑰图rose实现代码

    var myChart = echarts.init(document.getElementById('echarts_2'));
    var option = {
    color: ["#a71a4f", "#bc1540", "#c71b1b", "#d93824", "#ce4018", "#d15122", "#e7741b", "#e58b3d", "#e59524", "#dc9e31", "#da9c2d", "#d2b130", "#bbd337", "#8cc13f", "#67b52d", "#53b440", "#48af54", "#479c7f", "#48a698", "#57868c"],
    tooltip: {
    trigger: 'item',
    formatter: "{b} <br/>{c}万元"
    },
    legend: {
    left: '3%',
    orient: 'vertical',
    type: "scroll",
    data: ["建设路街道", "长兴路街道", "长社路街道", "金桥路街道", "和尚桥镇", "坡胡镇", "后河镇", "石固镇", "老城镇", "南席镇", "大周镇", "董村镇", "古桥镇", "石象镇", "佛耳湖镇", "增福镇"],
    icon: 'circle',
    textStyle: {
    color: '#fff',
    }
    },
    calculable: true,
    series: [{
    name: '街道',
    type: 'pie',
    //startAngle: 0,
    //clockwise: false,
    radius: ["10%", "80%"],
    center: ['55%', '50%'],
    roseType: 'area',
    avoidLabelOverlap: false,
    label: {
    show: true,
    position: 'inside',
    formatter: '{c}万元',
    textStyle: {
    fontWeight: 'bold',
    fontFamily: 'Microsoft YaHei',
    color: '#FAFAFA',
    fontSize: 8
    },
    },
    labelLine: {
    show: true,
    length: 0,
    length2: 2,
    },
    data: [
    {value: 600, name: '建设路街道'},
    {value: 1100, name: '长兴路街道'},
    {value: 1200, name: '长社路街道'},
    {value: 1300, name: '金桥路街道'},
    {value: 1250, name: '和尚桥镇'},
    {value: 400, name: "坡胡镇"},
    {value: 680, name: "后河镇"},
    {value: 150, name: "老城镇"},
    {value: 470, name: "石固镇"},
    {value: 780, name: "南席镇"},
    {value: 680, name: "大周镇"},
    {value: 880, name: "董村镇"},
    {value: 1201, name: "古桥镇"},
    {value: 540, name: "石象镇"},
    {value: 960, name: "佛耳湖镇"},
    {value: 1280, name: "增福镇"}
    ].sort(function (a, b) { return b.value - a.value;}),
    }]
    };

    myChart.setOption(option);
    window.addEventListener("resize", function () {
    myChart.resize();
    });

  • 相关阅读:
    BZOJ4238:电压
    BZOJ4566:[HAOI2016]找相同字符
    BZOJ4530:[BJOI2014]大融合
    BZOJ1912:[APIO2010]patrol巡逻
    BZOJ3998:[TJOI2015]弦论
    CNBlogs 样式修改
    POJ-3321 Apple Tree 【DFS序+树状数组】
    BZOJ-2152 聪聪可可 【点分治】
    POJ-1741 Tree 【点分治】
    Treap实现名次树
  • 原文地址:https://www.cnblogs.com/onesea/p/13277649.html
Copyright © 2011-2022 走看看