首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何将对象`HTMLImageElement`转换为excel

如何将对象`HTMLImageElement`转换为excel
EN

Stack Overflow用户
提问于 2018-09-27 17:16:19
回答 2查看 205关注 0票数 0

我有一个问题,我想在excel中导出我的图表,但是当我将图表转换为对象HTMLImageElement并应用

document.body.appendChild(newImg);

我使用asp经典函数:

代码语言:javascript
复制
 <%
 Response.ContentType = "application/vnd.ms-excel"
 Response.AddHeader "Content-Disposition","filename=""ExcelExport.xls"""
 %>

excel文件不转换新的img.how我可以在excel文件中看到新的img吗?我可以对excel文件使用另一种类型的转换吗,或者我必须转换之前的HTMLImageElement?

下面是.css和.js文件:

代码语言:javascript
复制
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">

<script type="text/javascript" src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/javascript-canvas-to-blob/3.14.0/js/canvas-to-blob.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.8   /FileSaver.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<script src="utils.js"></script> <!--function for chart creation/mod-->
<style>
</style>

Html和javascript函数

代码语言:javascript
复制
<prova></prova>
<button id="myButtonControlID"></button>
<div id="divTableDataHolder">

<div id="pagina">
        <div style="width:75%;">`enter code here`
            <canvas id="canvas"></canvas>
        </div>
    <img id"image">
    <button id="Aimg">Aggiorna IMG</button>
    </div>
</div>


<script>
    //***************************************insert the chart creation here**************************************
$(function() { 
setTimeout(assignSampleClick, 500);
});
function assignSampleClick () {
    canvas.toBlob(function(blob) {
        var newImg = document.createElement('img'),
         url = URL.createObjectURL(blob);
        newImg.onload = function() {
    // no longer need to read the blob so it's revoked
    //  document.querySelector("#image").src = url;
            URL.revokeObjectURL(url);
        };
    newImg.src = url;
    document.body.appendChild(newImg);
    alert(newImg)
    // document.getElementsByTagName('prova')[0].innerHTML =url;
    },'image/gif');
};
$("#Aimg").click(function() {

    canvas.toBlob(function(blob) {
        var newImg = document.createElement('img'),
        url = URL.createObjectURL(blob);

            newImg.onload = function() {
     // no longer need to read the blob so it's revoked
                URL.revokeObjectURL(url);
            };
        alert(url)
        newImg.src = url;
        document.body.appendChild(newImg);
     //document.getElementsByTagName('body')[0].innerHTML ="funziona?BOH  SEMBRA DI SI";
    },'image/gif');
});

window.onload = function() {
    var ctx = document.getElementById('canvas').getContext('2d');
    window.myLine = new Chart(ctx, config);
};

 $("[id$=myButtonControlID]").click(function(e) {
     window.open('data:application/vnd.ms-excel,' + encodeURIComponent(    $('div[id$=divTableDataHolder]').html()));
    e.preventDefault(); //this is another type of conversion
});
</script>

转换所有html的Asp代码

代码语言:javascript
复制
<% Response.ContentType = "application/vnd.ms-excel"
Response.AddHeader "ContentDisposition", "filename=""ExcelExport.xls"""%>
EN

回答 2

Stack Overflow用户

发布于 2018-10-04 23:26:07

当您说您“使用asp经典功能”时,您真正做的是将生成的HTML发送到具有“非标准”内容类型和部署标头的客户端。当我说非标准时,我指的不是HTML输出的标准标头-这些标头是下载真正的Excel版本97-2003二进制格式文件时使用的标头。大多数浏览器都会将该文件直接传递给Excel应用程序;Excel恰好对带有Excel扩展名的HTML文件很宽松,并且会尝试将其解析为工作表格式。

为了获得更多的功能,你需要使用一个全功能的库来生成文件,比如ExcelJS --不过我不知道它是否支持图像。

票数 0
EN

Stack Overflow用户

发布于 2018-10-24 19:19:54

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/52533528

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档