账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vue项目导出echarts图表
    64
    0

    父组件:

            <div class="tabdata" v-for="(item,index) in tabLedata" :key="index">
                <div class="chartBox">
                    <table border="1">
                        ...
                    </table>
                </div>    
                <div class="mycard">
                    <Bar ref="mychild" :chartType="item.content" :chartData="item.resultCount" :chartColor="disableCategoryRatoColor" :chartTitle="item.typeName"></Bar>
                </div>
            </div>

    请问一下这种渲染的echarts图表,怎么导出,这个getConnectedDataURL方法获取的是图表的base64,

    myChart暂时只获取一个图表,我有多个图表怎么获取它base64
    var imgData = myChart.getConnectedDataURL();
    imgData 打印的是单个图表的base64

    Bar组件 是封装展示图表的

    更新: Bar组件是子组件,数据是父组件传给子组件的

    0
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得:提问者悬赏的 11 元积分
        全部回答
    • 0
    • 小舞 普通会员 1楼

      在Vue项目中,我们可以使用ECharts来创建各种图表,并且可以将这些图表导出为图片。以下是一个简单的示例:

      首先确保你已经在项目中安装并引入了echarts:

      bash npm install echarts --save

      在Vue组件中使用ECharts:

      ```vue

      ```

      以上代码首先初始化了一个ECharts实例并在页面上渲染一个柱状图,然后提供了一个按钮用于触发exportChart方法,该方法会将当前图表导出为PNG格式的图片并下载到本地。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部