Как я могу преобразовать, чтобы превзойти объект `HTMLImageElement`

Question

У меня есть проблема, я хочу экспортировать в Excel свою диаграмму, но когда я конвертирую свою диаграмму как объект, HTMLImageElement и применяю

document.body.appendChild(newImg);

Я использую классик aspфункция:

 <%
 Response.ContentType = "application/vnd.ms-excel"
 Response.AddHeader "Content-Disposition","filename=""ExcelExport.xls"""
 %>

файл exel не конвертирует новый img. как я могу увидеть новый img в файле excel? могу ли я использовать другой тип конвертации для файла excel, или я должен конвертироватьHTMLImageElement раньше?

Вот файлы .css и .js:

<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

<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>

Asp-код для преобразования всех html

<% Response.ContentType = "application/vnd.ms-excel"
Response.AddHeader "ContentDisposition", "filename=""ExcelExport.xls"""%>

Answer 1

посмотрите эти страницы для экспорта данных

https://datatables.net/extensions/buttons/examples/initialisation/export.html

Answer 2

Когда вы говорите, что «используете классическую функцию asp», вы действительно отправляете сгенерированный HTML-код клиенту с «нестандартным» типом содержимого и заголовком расположения.Когда я говорю «нестандартный», я имею в виду не стандартный заголовок для вывода HTML - это заголовки, используемые при загрузке файла двоичного формата Excel версии 97-2003.Большинство браузеров передают этот файл прямо в приложение Excel;Просто так получилось, что Excel снисходительно относится к HTML-файлам с расширением Excel и попытается проанализировать их в формате листа.

Чтобы получить больше функциональности, вам нужно использовать полнофункциональную библиотеку для генерации файлов Excel, например ExcelJS - хотя я не знаю, поддерживает ли она изображения.