如何在highCharts中添加自定義導出按鈕？

我們在我們的應用程序中使用了highcharts，我想在打印和導出按鈕旁添加一個按鈕。我確實有 jsfiddle 如何在highCharts中添加自定義導出按鈕？

var chart1; 
     $(document).ready(function() { 

      // Add Custom button to highchart 
      chart1 = new Highcharts.Chart({ 
       chart: { 
        renderTo: 'container1', 
        shadow: true 
       }, 
       title: { text: 'Sales' }, 
       xAxis: { 
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 
           'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] 
       }, 
       yAxis: { title: { text: '$'} }, 
       series: [{ 
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 
          135.6, 148.5, 216.4, 194.1, 95.6, 54.4] 
       }], 
       exporting: { 
         buttons: { 
          'exportTo': { 
           _id: 'exportTo', 
           symbol: 'diamond', 
           x: -62, 
           symbolFill: '#B5C9DF', 
           hoverSymbolFill: '#779ABF', 
           onclick: function() { 
            showDialog(this); 
           } 
          } 
         } 
        } 

      }); 


var showDialog = function (selectedChart) { 

       var modal = $("#myModal").modal(); 
       $('#btnSaveImage').click(function() { 
        saveChartInNas(selectedChart); 
        modal.modal('hide'); 
       }); 
      }; 
     });

我們有很多的圖表工作示例，圖表上的點擊我要顯示一個模式窗口，並做保存按鈕一些過程。而不是創建所有不同頁面中的所有圖表的模態和導出屬性設置，我想知道是否有可能某種插件或附加？如果是這樣，有人可以告訴我如何實現這一點。

我不想在所有的網頁添加出口邏輯。

謝謝

來源

2013-03-18 Think

的[管理多個highchart圖表在單個網頁（http://stackoverflow.com/questions/8253590/manage-multiple-highchart-charts-in-a-single-webpage） – 2013-03-19 00:55:48

圖表可能重複在不同的頁面中可用。如何爲所有頁面中的所有圖表編寫通用設置？ – Think 2013-03-20 22:30:37

我想你是問是否有其設置爲某種形式的違約，編輯每一個圖表定義的instad的方法嗎？

您應該看看Highcharts.setOptions（）http://api.highcharts.com/highcharts#Highcharts.setOptions() 這允許您爲所有圖表設置默認值。

來源

2013-03-19 09:20:49 SteveP

exporting: { 
          filename: 'event-id-metadata-graph', 
          buttons: { 
           contextButton: { 
            menuItems: [{ 
             text: 'Download PDF', 
             onclick: function() { 
              this.exportChart({ 
               type: 'application/pdf' 
              }); 
             } 
            }, { 
             text: 'Print', 
             onclick: function() { 
               alert('Launch Print Table function') 
             }, 
             separator: false 
            }] 
           } 
          } 
         },

來源

2017-05-23 14:40:21

如何在highCharts中添加自定義導出按鈕？

回答

相關問題