組合圖中的燭臺移位

我使用Google Chart API，主要是組合圖在同一圖形區域中顯示不同的數據。當我單獨使用CandleStick時，它看起來很好： candlestick only 組合圖中的燭臺移位

但是，當我添加另一個酒吧系列時，它會導致輕微的偏移，現在蠟燭看起來都搞砸了。 candlestick with bar

看來左縱軸的寬度會導致這種輕微的偏移。問題是，我需要顯示兩個軸。我嘗試調整strokewidth的下降和上升，它只是讓它看起來模糊。因此，使strokewidth小於1不太有效。

代碼

var options = { 
    title: jsondata['chart_title'], 
    hAxis: {direction: -1}, 
    vAxes: {0:{format:y_units},1:{format:"$#.##"}}, 
    seriesType: "bars", 
    series: {0: {type: "candlesticks", targetAxisIndex: 1}}, 
    candlestick: { 
     fallingColor:{ 
      strokeWidth: .5 
     }, 
     risingColor:{ 
      strokeWidth: .5 
     } 
    }, 
    displayAnnotations: true, 

    crosshair: { trigger: 'both' } 
}

和實際的繪製元件

var chart = new google.visualization[jsondata['chart_type']](document.getElementById('chart_div')); 
$.extend(options, {legend:{position:'bottom'}}) 
chart.draw(data, options);

示例數據

['Mon', 11, 10, 8, 17, 1], 
['Tue', 12, 17, 7, 28, 5], 
['Wed', 6, 22, 5, 25, 0], 
['Thu', 10, 11, 16, 11, 0], 
['Fri', 15, 44, 25, 44, 3]

Ñ ote：數據需要使用LARGER才能生效，因此，複製粘貼這些數據10次應該有所裨益。當只有很少的數據點時，燭臺相當大，即使有效果，也是微不足道的

任何建議，使其看起來正常？

來源

2014-03-13 rodling

你能添加代碼來將問題複製到你的問題嗎？ – asgallant

你也可以添加樣本數據嗎？我需要能夠完全複製這個問題，以便找出需要解決的問題。 – asgallant

更新了！數據只是粗略的樣本，它實際上只是LARGER數據集上的一個問題，所以如果你複製那個樣本* 10可以這麼說，那麼它將是可見的 – rodling

當圖表的寬度中有太多的條形（蠟燭條和條形）數據點時，會發生此效應。當使用離散（字符串類型）軸時，每個數據行將爲條組分配（寬度/行）像素，而條在組內並排對齊，當組寬度產生一些奇怪效果時變窄。

增加圖表
增加條組的寬度的寬度（通過bar.groupWidth選項，設定爲'100%'最大化）
：可以通過使用下列一些組合解決該問題設置isStacked選項true
使用Control來過濾數據，使顯示的數據集小

來源

2014-03-13 22:36:04 asgallant

好的解釋！我做了＃2，休息對我來說不是一個真正的選擇。你知道是否有辦法擴大實際的蠟燭而不是邊界的寬度？我通過文檔查看，沒有發現任何。也有任何方式來改變棒的寬度，而不是蠟燭？棒和蠟燭之間的厚度比較比較差我認爲 – rodling

不，這些是不可配置的，對不起。 – asgallant

重疊另一個頂部（酒吧和蠟燭）會很棒，或者擴大蜡燭。我想我必須屈服於此，謝謝解釋！ – rodling

組合圖中的燭臺移位

回答

相關問題