angularJSのロゴ付きpdfへ剣道図をエクスポート

Question

ここに私のanglejsコードはpdfのみをエクスポートするのですが、私はカスタムロゴでエクスポートしたいと思います。この質問の助け？ 私の剣道チャートHTMLコードはここにある：

<div kendo-chart="vm.chart" 
       k-options="vm.chartOptions" 
       k-data-source="vm.chartOptions.datasource"> 
      </div> 

とエクスポートボタンのコードはここ..です

vm.saveAsPdf = function (event) { 
    var elem ; 
    if (navigator.userAgent.indexOf("Chrome") !== -1) { 
     elem = event.toElement; 
    } 
    else { 
     elem = event.currentTarget; 
    } 
    //$(elem).parent().next().find('.k-chart').getKendoChart().saveAsPDF(); 
    debugger; 
    var chart = $(".k-chart").getKendoChart(); 

    var fileName = $(elem).closest('li').children().find('.ng-binding').text().trim(); 
    chart.exportPDF({ paperSize: "auto", margin: { left: "1cm", top: "1cm", right: "1cm", bottom: "1cm" } }).done(function (data) { 
     kendo.saveAs({ 
      dataURI: data, 
      fileName: fileName + ".pdf" 
     }); 
    }); 
} 

Answer 1

は、チャートが描画された後、その表面上に描画するグラフのrender eventを使用します。

次に、Kendo Drawing Imageを使用してロゴを追加します。デモで

render: function(e){ 
    var chart = e.sender; 
    var draw = kendo.drawing; 
    var geom = kendo.geometry; 

    var rect = new geom.Rect(
     [50, 0], // Position of the top left corner 
     [400, 60] // Size of the rectangle 
    ); 
    var image = new draw.Image("https://www.w3.org/Icons/SVG/svg-logo-h.svg", rect); 
    chart.surface.draw(image); 
} 

DEMO

私はチャートの左上に近いランダムな画像を追加しています。