2013-04-28 42 views
1

如何將圖像添加到可正確縮放到酒吧高度的酒吧列中。Highchart與列欄中的縮放圖像?

看到下面的jsfiddle例子,即時嘗試做一個圖表,比較高度使用摩天大樓圖像作爲酒吧列的背景,但背景圖像似乎隨機循環/瓦片,我該如何解決這個問題。

感謝

 color: { 
      pattern: 'http://www.aperfectworld.org/clipart/buildings/buildings08g.gif', 
      width: '100%', 
      height: '100%' 
     } 

http://jsfiddle.net/2BqSY/4/

回答

3

我認爲它可能使用模式是不可能的,但可以使用渲染器添加一些圖片: http://jsfiddle.net/YZkPX/

chart: { 
     renderTo: 'container', 
     type: 'column', 
     events: { 
      load: function() { 
       var chart = this, 
        d = chart.series[0].data; 

       for (var i = 0, len = d.length; i < len; i++) { 
        var p = d[i], 
         x = chart.plotLeft + p.plotX - p.pointWidth/2, 
         y = chart.plotTop + p.plotY, 
         w = p.pointWidth, 
         h = p.graphic.height; 
        chart.renderer.image('http://www.aperfectworld.org/clipart/buildings/buildings08g.gif', x, y, w, h).add(); 

       } 

      } 
     } 
    }, 

現在,您需要重新計算x/y/w/h系列重繪時(縮放/顯示/隱藏等)