zoukankan      html  css  js  c++  java
  • echart-scatter使用散点图,带坐标和项目名称

    option = {
    timeline: {
    show: false,
    data: [
    '数据分析',
    ],
    label: {
    formatter: function (s) {
    return s.slice(0, 4);
    }
    },
    autoPlay: false,
    heigth: 1,
    padding:1,
    playInterval: 1500
    },
    options: [
    {
    title: {
    'text': '各城市广告位均价、销售率增幅分析(均价增幅 vs 销售率增幅)',
    'subtext': '----数据来自电子排期系统',
    'x': 'center',
    'textStyle': {fontFamily:'微软雅黑'}
    },
    tooltip: {
    trigger: 'axis',
    showDelay: 0,
    axisPointer: {
    show: true,
    type: 'cross',
    lineStyle: {
    type: 'dashed',
    1
    }
    }
    },
    toolbox: {
    'show': true,
    orient: 'vertical',
    x: 'right',
    y: 'center',
    'feature': {
    'restore': { 'show': true },
    'saveAsImage': { 'show': true }
    }
    },
    grid: { 'y': 80, 'y2': 100 },
    xAxis: [{
    'type': 'value',
    'name': '均价增幅(%)',

    }],
    yAxis: [{
    'type': 'value',
    'name': '销售率增幅(%)',

    }],
    series: [
    {
    'name': '销售均价增幅 , 销售率增幅',
    'type': 'scatter',
    markLine: {
    data: [
    { type: 'average', name: '销售均价增幅平均值', itemStyle: { normal: { borderColor: 'green' } } },
    { type: 'average', name: '销售率增幅平均值', valueIndex: 0, itemStyle: { normal: { borderColor: 'green' } } }
    ]
    },
    symbol: 'pin',
    symbolSize: 5,
    itemStyle: {
    normal: {
    label: {
    show: true,
    formatter: '{b}'
    },
    color: '#ff6633'
    }
    },
    'data': result.data //格式[{ name: '北京', value: [20, 5] }, { name: '上海', value: [17, 8] }
    }
    ]
    }
    ]
    };
    myScatter.clear();
    myScatter.setOption(option);
    }

  • 相关阅读:
    如何利用python爬虫爬取音乐
    python中文件操作各符号意思
    基于node.js人脸识别之人脸对比
    体感在js中的调用
    了解Github
    初识微信小程序
    Spring中表达式语言spring-expression简单使用
    IDEA对jsr305的Nonnull注解和Guava的Beta注解的支持
    设计模式之访问者模式
    设计模式之桥接模式
  • 原文地址:https://www.cnblogs.com/liuchuanxu/p/4613555.html
Copyright © 2011-2022 走看看