How do I export a base64 image to excel?

Viewed 5592

I am looking for a way to Export Excel Charts from NVd3 in Angularjs.

I am trying code like this (jsfiddle)

<button id="myButtonControlID">Export Table data into Excel</button>
<div id="divTableDataHolder">
    <table>
        <tbody>
            <tr>
                <td><img src='http://codepattern.net/Blog/pics/CodepatternLogoN.png' alt=''/></td>
            </tr>
            <tr>
                <td><img id="img" src='' alt=''/></td>
            </tr>
        </tbody>
    </table>
</div>
$("[id$=myButtonControlID]").click(function(e) {
    window.open('data:application/vnd.ms-excel,' + encodeURIComponent( $('div[id$=divTableDataHolder]').html()));
    e.preventDefault();
});
document.getElementById("img").src ="data:image/png;base64,..."
1 Answers

Excel doesn't seem to like base64 encoded images...

Try simply doing a ajax POST request to your server with the PNG base64 encoded data of the currently failing image, into a service which stores images and provides hosting for them, some example php code (I'm assuming you have access to a linux server that can run php):

<?php
$somecode = unique_name(); //left as excersise for the reader.

move_uploaded_file($_FILES["filename"]["tmp_name"],"destination_$somecode.png");
//also, check for errors.
echo $somecode;

Then simply use the server's response as the URL in the excel file. that way you can embed a link to an image instead of an image itself.

so the cell contents could me similar to:

<td><img src='yourhost.com/your_image_location' /></td>

Smaller excel files should make people happy, but You'll have to consider things like how long the files will live there consider including the actual data that was used to generate the form, so future excel users can rebuild the graph inexpensively if the image server goes down, or the images "expire".

I Hope this helps!

Related