將堆積列谷歌圖表轉變爲瀑布圖

Question

我一直致力於使用谷歌圖表複製瀑布圖表。我已經設計了2個系列的堆疊柱，其中第一個系列是透明的，所以第二個可見系列似乎是浮動的，就像瀑布圖看起來一樣。問題在於第一個透明系列保持交互式，並突出顯示鼠標懸停，並顯示標籤和註釋。你能幫我弄清楚如何停止檢測到的第一列系列。

我發現有人已經完成了這個，但他們沒有提到這是如何完成的。 http://data-ink.com/?p=612。

這裏是代碼的數據部分：

var data = google.visualization.arrayToDataTable([ 
    ['Genre', 'Label1', { role: 'annotation', role:'style' }, 'Label2', { role: 'annotation', role:'style' } ], 
    ['column1', 5, 'opacity: 0.2', 11, 'opacity: 0.2'], 
    ['column2', 5, 'opacity: 0.2', 12, 'opacity: 0.2'], 
    ['column3', 5, 'opacity: 0.2', 13, 'opacity: 0.2'], 
    ['column4', 5, 'opacity: 0.2', 14, 'opacity: 0.2'], 
    ['column5', 5, 'opacity: 0.2', 15, 'opacity: 0.2'], 
    ['column6', 5, 'opacity: 0.2', 26, 'opacity: 0.2'] 
]); 

這裏是jsFiddle通過R3tep誰回答我的問題，不透明度友情提供。請注意我已經將3系列減少爲2.

Answer 1

在期望的系列上使用選項enableInteractivity: false。

series:{0: {enableInteractivity: false}} // Serie 0 is the first serie in your array declaration 

，並設置不透明度爲零：

var data = google.visualization.arrayToDataTable([ 
    ['Genre', 'Label1', { 
     role: 'annotation', 
     role: 'style' 
    }, 'Label2', { 
     role: 'annotation', 
     role: 'style' 
    }], 
    ['column1', 5, 'opacity: 0', 11, 'opacity: 0.2'], 
    ['column2', 5, 'opacity: 0', 12, 'opacity: 0.2'], 
    ['column3', 5, 'opacity: 0', 13, 'opacity: 0.2'], 
    ['column4', 5, 'opacity: 0', 14, 'opacity: 0.2'], 
    ['column5', 5, 'opacity: 0', 15, 'opacity: 0.2'], 
    ['column6', 5, 'opacity: 0', 26, 'opacity: 0.2'] 
]); 

Live demo