46697
# 環境

  * Python3.6.5
  * Bokeh 0.13.0  
<https://bokeh.pydata.org/en/latest/docs/gallery.html>

# やりたいこと

データ可視化ライブラリBokehを用いて、以下のような「積み上げ面グラフ」を作成したいです。

[![画像の説明をここに入力](https://i.stack.imgur.com/f7jUC.png)](https://i.stack.imgur.com/f7jUC.png)

<https://jp.cybozu.help/ja/k/user/graph_type> 引用

Bokeh 0.12のときは、`bokeh.charts.Area`を使って、簡単に書くことができます。

```

    from bokeh.charts import Area, show, output_file, defaults
    from bokeh.layouts import row
    
    defaults.width = 400
    defaults.height = 400
    
    # create some example data
    data = dict(
        python=[2, 3, 7, 5, 26, 221, 44, 233, 254, 265, 266, 267, 120, 111],
        pypy=[12, 33, 47, 15, 126, 121, 144, 233, 254, 225, 226, 267, 110, 130],
        jython=[22, 43, 10, 25, 26, 101, 114, 203, 194, 215, 201, 227, 139, 160],
    )
    
    area1 = Area(data, title="Area Chart", legend="top_left",
                 xlabel='time', ylabel='memory')
    
    area2 = Area(data, title="Stacked Area Chart", legend="top_left",
                 stack=True, xlabel='time', ylabel='memory')
    
    output_file("area.html", title="area.py example")
    
    show(row(area1, area2))
    
```

<https://bokeh.pydata.org/en/0.12.5/docs/gallery/area_chart.html> 引用

しかし、Bokeh0.13.0では、`bokeh.charts.Area`クラスがなくなっていました。

# 質問

Bokeh 0.13で、「積み上げ面グラフ」用を作成するのには、どのクラスを使えばよろしいでしょうか？  
`patches`メソッドを使って、「積み上げ面グラフ」を作成しているサンプルはありましたが、自分でstack値を計算していて、`Area`より不便です。  
もう少し便利なクラスやメソッドがありましたら、教えてください。

```

    import numpy as np
    import pandas as pd
    
    from bokeh.plotting import figure, show, output_file
    from bokeh.palettes import brewer
    
    N = 20
    cats = 10
    df = pd.DataFrame(np.random.randint(10, 100, size=(N, cats))).add_prefix('y')
    
    def  stacked(df):
        df_top = df.cumsum(axis=1)
        df_bottom = df_top.shift(axis=1).fillna({'y0': 0})[::-1]
        df_stack = pd.concat([df_bottom, df_top], ignore_index=True)
        return df_stack
    
    areas = stacked(df)
    colors = brewer['Spectral'][areas.shape[1]]
    x2 = np.hstack((df.index[::-1], df.index))
    
    p = figure(x_range=(0, N-1), y_range=(0, 800))
    p.grid.minor_grid_line_color = '#eeeeee'
    
    p.patches([x2] * areas.shape[1], [areas[c].values for c in areas],
              color=colors, alpha=0.8, line_color=None)
    
    output_file('brewer.html', title='brewer.py example')
    
    show(p)
    
```

<https://bokeh.pydata.org/en/latest/docs/gallery/brewer.html> 引用
CC BY-SA 4.0
2018-07-18T04:05:08.623
46685
2022-02-18T13:12:48.280
2018-07-18T05:05:23.113
19110
19524
question
python bokeh
Bokeh 0.13で、積み上げ面グラフを書く方法
`Bokeh`の`bkcharts`の後継は`HoloViews`です。`HoloViews`は、`Bokeh`をバックエンドにして簡潔な記述でグラフを描くことができます。

`HoloViews`の面グラフのドキュメントとサンプルへのリンクは、次のとおりです。

ドキュメント: <http://holoviews.org/reference/elements/bokeh/Area.html>  
サンプル: <http://holoviews.org/gallery/demos/bokeh/area_chart.html>

サンプルのコードは、次のとおりで、質問にあるBokeh 0.12のときの、`bokeh.charts.Area`を使って書くのと同じグラフになっています。

```

    import numpy as np
    import holoviews as hv
    hv.extension('bokeh')
    
    # create some example data
    python=np.array([2, 3, 7, 5, 26, 221, 44, 233, 254, 265, 266, 267, 120, 111])
    pypy=np.array([12, 33, 47, 15, 126, 121, 144, 233, 254, 225, 226, 267, 110, 130])
    jython=np.array([22, 43, 10, 25, 26, 101, 114, 203, 194, 215, 201, 227, 139, 160])
    
    dims = dict(kdims='time', vdims='memory')
    python = hv.Area(python, label='python', **dims)
    pypy   = hv.Area(pypy,   label='pypy',   **dims)
    jython = hv.Area(jython, label='jython', **dims)
    
    overlay = (python * pypy * jython).options('Area', fill_alpha=0.5)
    overlay.relabel("Area Chart") + hv.Area.stack(overlay).relabel("Stacked Area Chart")
    
```

なお、Plotするところで、`+`と`*`の演算子がありますが、`+`は、グラフを並べる演算子で、`*`はグラフを重ねる演算子です。`HoloViews`では、`+`と`*`の演算子を組み合わせることで簡単にグラフを並べたり重ねたりできます。
CC BY-SA 4.0
2018-07-18T10:45:45.613
46697
2018-07-19T00:34:41.827
2018-07-19T00:34:41.827
15171
15171
46685
answer
bokeh 2.4の場合、`bokeh.plotting.Figure.varea_stack`関数で、積み上げ面グラフを作ることができました。

<https://docs.bokeh.org/en/latest/docs/reference/plotting/figure.html#bokeh.plotting.Figure.varea_stack>

<https://docs.bokeh.org/en/latest/docs/gallery/stacked_area.html>
CC BY-SA 4.0
2022-02-18T13:12:48.280
86438
2022-02-18T13:12:48.280
19524
46685
answer