美文网首页
echarts3 在一个canvas中同时绘制折线图和柱状图

echarts3 在一个canvas中同时绘制折线图和柱状图

作者: IamaStupid | 来源:发表于2020-09-17 11:10 被阅读0次

echarts3 在一个canvas中同时绘制折线图和柱状图

series 是一个数组,可以同时包含各种图型的数据。

代码:

getOption () {
      let xData = ['2019-01', '2019-08', '2020-04', '2020-07']
      let yLineData = [820, 932, 901, 934];
      let yBarData = [920, 900, 900, 734];
      let option = {
        xAxis: {
            type: 'category',
            data: xData
        },
        yAxis: {
            type: 'value'
        },
        series: [
          {
            data: yLineData,
            type: 'line',
            smooth: true
          },
          {
            data: yBarData,
            type: 'bar',
            smooth: true
          }
        ]
      };
      return option;
}

相关文章

  • echarts3 在一个canvas中同时绘制折线图和柱状图

    echarts3 在一个canvas中同时绘制折线图和柱状图 series 是一个数组,可以同时包含各种图型的数据...

  • charts 写柱状图和折线图

    绘制柱状图 绘制折线图

  • 2018-04-24

    matplotlib绘图 通常我们可以绘制折线图、饼状图、柱状图,用matplotlib绘制折线图、柱状图情况较多...

  • 小程序绘制折线图横向滚动卡顿

    代码如下 我将canvas标签包含在scroll-view中然后我绘制一个折线图,当折线图超出屏幕的时候会发生卡顿...

  • ggplot2绘制柱状图+折线图

    之前分享过不少绘制柱状图的案例,各种类型的都有,今天来展示一个ggplot2绘制柱状图并加上折线图的案例,依然使用...

  • MPAndroid源码分析

    MPAndroid是开源的图标绘制框架。能够绘制 ,支持绘制折线图,柱状图,组合图,radar图等。 本文主要解决...

  • Chart.js轻量级图表库的使用经验

    前言 最近项目中遇到一个在页面中画图表的需求,需要一个扇状图和一个柱状图,虽然能使用svg或canvas绘制,但吃...

  • 2019-03-21

    JavaScript canvas canvas 绘制图形,结合逻辑整理动画效果,页面柱状图等 基本操作 1.xx...

  • Android - 绘制带有渐变色的折线图

    图表绘制的需求在安卓开发中并不少见。常见的有饼图,柱状图,折线图等等。在这里,我们可以给折线图添加一些色彩。除了线...

  • CoreGraphics绘制图表教程(三)

    本篇介绍如何使用CoreGraphics绘制柱状图、圆饼图、环形图以及区域填充 绘制折线图:就是三板斧中的画一条线...

网友评论

      本文标题:echarts3 在一个canvas中同时绘制折线图和柱状图

      本文链接:https://www.haomeiwen.com/subject/woklyktx.html