echarts圖表生成後的下載，本身是帶有這個下載工具欄的，

但是可以通過另外的方法對該圖表進行下載或者是展示。

如圖：

圖表一是用echarts畫出的，圖表二是僅一張img圖片，圖表三則是一張可以下載的img圖片。
html：

<div id="main" style="width: 400px;height:200px;"></div>

js：

    // 基於準備好的dom，初始化echarts例項（開頭：圖表顯示區域）
    var myChart = echarts.init(document.getElementById('main'
 
));

    // 指定圖表的配置項和資料（圖表資料及樣式配置）
    option = {
        backgroundColor: 'rgba(255,255,255,1)',
        toolbox: {
            show : true,
            feature : {
                mark : {show: true},
                restore : {show: true},
                saveAsImage : {
                    show: true
 
,
                    pixelRatio: 1,
                    title : '儲存為圖片',
                    type : 'png',
                    lang : ['點選儲存']         
                }
            }
        },
        series : [
            {
                name:'業務指標',
                type:'gauge',
                detail : {formatter:'{value}%'
 
},
                data:[{value: 50, name: '完成率'}]
            }
        ]
    };
    myChart.setOption(option);

圖表二很簡單，就是直接通過getDataURL()方法把圖表的圖片資訊轉化為base64的格式，這個是可以直接通過放入img標籤的src內進行展示的，這個時候圖片的下載鍵是不起作用的。實現如下：
html：

<div class="showImg1"></div>

js：

var picBase64Info = myChart.getDataURL(); $(".showImg1").html('<img src="'+picBase64Info+'"/>')

即可。
注：網上蠻多地方說的是用getDataURL(“png”)這樣的方式實現，但是這個有個問題是，這樣得到的關於圖表的base64的圖片資訊背景色是透明的，如圖：

，直接用getDataURL()則是完全copy這個圖表的圖片資訊的。

圖表三提供了另一種方式的下載，把圖表資訊轉為canvas之後進行下載。
實現如下：
html：

<p class="showImg"><!--<img id="ringoImage" alt="" src=""/>--></p>
<div><a onclick="down()" href="javascript:void(0);">下載圖片</div>
<div class="base64"></div>

js：

/* 根據圖片生成畫布*/
function convertImageToCanvas(image) {
    var canvas = document.createElement("canvas");
    canvas.width = image.width;
    canvas.height = image.height;
    canvas.getContext("2d").drawImage(image, 0, 0);
    return canvas;
}
/* 下載圖片*/
function down() {
    var sampleImage = document.getElementById("ringoImage"),
    canvas = convertImageToCanvas(sampleImage);
    url = canvas.toDataURL("image/png");//PNG格式
    //以下程式碼為下載此圖片功能
    var triggerDownload = $("#download").attr("href", url).attr("download", "echartsImg.png");
    triggerDownload[0].click();
}

但是現在有個問題是這個不管是echarts自帶的下載圖片的功能還是後面所說的別的方法，不知道是哪裡的問題，在手機瀏覽器上是下不下來的，提示下載失敗，在此記錄一下，看是否可以找到解決的方法！