Echarts多张图片插入word解决方案

最新推荐文章于 2023-08-24 17:11:36 发布

VIP文章 q1024748358

最新推荐文章于 2023-08-24 17:11:36 发布

阅读量1.5k

点赞数

分类专栏： java、echarts图片保存、图片插入word

本文链接：https://blog.csdn.net/q1024748358/article/details/72902256

版权

测试生成的jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <base href="<%=basePath%>">

    <title>Echarts图片生成wordDEMO</title>
   <meta http-equiv="pragma" content="no-cache">
   <meta http-equiv="cache-control" content="no-cache">
   <meta http-equiv="expires" content="0">
   <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
   <meta http-equiv="description" content="This is my page">
   
</head>

<body>
    
    <div id="main" style="height:400px"></div>
    
    <script src="<%=basePath %>js/echarts-2.2.7/build/dist/echarts.js"></script>
    <script type="text/javascript">
        // 路径配置
        require.config({
            paths: {
                echarts: '<%=basePath %>js/echarts-2.2.7/build/dist'
            }
        });

        // 使用
        require(
            [
                'echarts',
                'echarts/chart/bar' // 使用柱状图就加载bar模块，按需加载
            ],
            function (ec) {
                // 基于准备好的dom，初始化echarts图表
                var myChart = ec.init(document.getElementById('main'));

                var option = {
                    tooltip: {
                        show: true
                    },
                    legend: {
                        data:['销量']
                    },
                    xAxis : [
                        {
                            type : 'category',
                            data : ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
                        }
                    ],
                    yAxis : [
                        {
                            type : 'value'
                        }
                    ],
                    series : [
                        {
                            "name":"销量",
                            "type":"bar",
                            "data":[5, 20, 40, 10, 10, 20]
                        }
                    ]
                };

                // 为echarts对象加载数据
                myChart.setOption(option);
                setTimeout(exportImage, 2000);
                //exportImage();
                var i=0;
                function exportImage(){
                    var data = "ImageData="+encodeURIComponent(myChart.getDataURL("png"));
                    //图片名称报告名称（与wordPath.properties 保持一致）
                    //校验是否加载echarts
                    if(data.indexOf("image")<0&&i<=3){
                        setTimeout(exportImage, 2000);
                        i++;
                        return;
                    }
                    var reportCode="safety_service_report";
                    var imageName="test1";
                    var params=data+"&reportCode="+reportCode+"&imageName="+imageName;
                    if(data.indexOf("image")<0){
                       params+="&msg=ERROR"

最低0.47元/天解锁文章

q1024748358

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Echarts多张图片插入word解决方案

测试生成的jspString path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%> "> Echart
复制链接

扫一扫