堆積水平圖表

Question

我想有一個圖表，是這樣的：

http://jcharts.sourceforge.net/samples/stackedBar.html#Horizontal+Stacked+Bar+Chart

我挑戰如何做到這一點的一個表，或者用div的等等。做一個簡單的圖表沒有多於一個部分似乎更容易。我不確定從哪裏開始，採取什麼方法或在網上看什麼。我想保持簡單。

看來我已經找到了一些插件等，但我想只是寫自己的HTML/CSS如果可能的話。我也與Ruby合作，並且一些插件是錯誤的語言。

Answer 1

那些圖表是圖像。用純HTML/CSS重現它們將是一個挑戰，可能不值得。

如果您找到適用於您的插件（也許是JavaScript），請使用它。

Answer 2

水平圖表非常簡單。您始終可以在div內使用div來表示堆疊的條，因此第一個div將具有藍色的背景色，並且在該div內您將具有黃色的背景色。

三維圖表，你可以爲每個欄和不同的內部的div不同的背景圖像顏色的背景圖像，讓您堆疊顏色變異圖表

這種佈局應該與DIVS和絕對定位

將全部完成