缩放echarts图表并下载另存为图片

野生小怪兽.

于 2024-11-14 15:19:37 发布

阅读量388

点赞数 2

CC 4.0 BY-SA版权

文章标签： echarts 前端 javascript

本文链接：https://blog.csdn.net/m0_63736306/article/details/143772003

在option里面直接添加以下代码，与其他属性平级

toolbox: {
      show: true,
      // feature参数是一个非常重要的配置项 
      //它用于控制图表的功能按钮，包括数据视图、保存图片、数据区域缩放、重置、刷新等。
      feature: {
        saveAsImage: { title: '保存为图片' },   //是否显示下载为图片
        dataZoom: { title: { zoom: '区域放大', back: '区域放大还原' } },  //zoom圈选进行放大  back还原上一步缩放
        dataView: { title: '数据视图', readOnly: false },  // 视图模式 分类统计
        restore: { title: '刷新' },    //还原echarts
      },

      // 下载图标的颜色
      iconStyle: {
        borderColor: "#f0f",
      },
      // 鼠标悬浮颜色
      emphasis: {
        iconStyle: {
          color: '#ff0',
        },
      },
      // 位于echarts的位置
      top: 10,       
      right: 20,     
      bottom: 10,    
    },