2013-04-30 93 views
0

我有這樣的圖表:打印highchart顯示數據全部點

http://jsfiddle.net/ECAM9/1/

,它工作正常。

然而,當我打印或導出它,我想要的結果圖像或PDF文件,看起來像這樣:

http://jsfiddle.net/rFzTG/

這意味着,我希望每一個點都在它的信息。

我一直在尋找這樣的回答:

Highcharts add legend on export

我嘗試添加此:

exporting:{ 
      chartOptions:{ 
       scatter: { 
        dataLabels: { 
         enabled: true, 
         formatter: function() { 
          return this.series.name +'</b><br/>'+ this.x +': '+ this.y +'°C'; 
         } 
        }, 
       } 
      } 
     }, 

但同樣,JPG文件我打印是沒有的信息。

+0

@SebastianBochan你可以檢查一下嗎? – 2013-04-30 13:51:24

回答

1

一種方式:

1)使用 'useHTML' 在圖表加載事件的datalabels

2),隱藏datalabel元件

圖表將顯示不datalabels,因爲你把它們藏,但datalabels打印,因爲圖表是與他們

http://jsfiddle.net/jlbriggs/Z7csw/

dataLabels: { 
    enabled: true, 
    useHTML:true, 
    formatter: function() { 
    return '<div class="datalabel">' +this.series.name +'</b><br/>'+ 
      this.x +': '+ this.y +'°C</div>'; 
    } 
}, 
創建

events:{ 
    load:function() { 
    $('.datalabel').hide(); 
    } 
} 

編輯: - > 好吧,我有一個簡單的例子,與印刷在這裏工作的基礎上,下面的評論:

http://jsfiddle.net/jlbriggs/Z7csw/6/

它並不完美,但它確實工作...

+0

這工作,TNX!但它只適用於出口。如何使它在印刷品上工作呢? – 2013-05-02 11:44:13

+0

嗯...不知道,我認爲這對兩者都有效:/可能需要使用外部控制...您可以捕獲按鈕單擊,啓用數據標籤,打印圖表和隱藏數據標籤...? – jlbriggs 2013-05-03 17:04:51

+0

尋找這裏:http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/exporting/buttons-contextbutton-menuitems/和在這裏:http ://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/members/chart-print/它看起來像是一個可行的選擇 – jlbriggs 2013-05-03 17:14:44