StackedAreaChart(nvd3)

from nvd3 import stackedAreaChart
import pandas as pd
import time
# 原文https://bl.ocks.org/mbostock/3885211,数据源也在原文内
data = pd.read_csv('test_data.csv')
data.columns
# 建立画布
chart = stackedAreaChart(name='stackedAreaChart', height=600, width=1024,x_is_date=True,x_axis_format="%d %b %Y",use_interactive_guideline=True)
# 提取数据
xdata = pd.to_datetime(data['date']).apply(lambda x:time.mktime(x.timetuple())* 1000)
ydata = data['Google Chrome'].astype(float)
ydata2 = data['Internet Explorer'].astype(float)
ydata3 = data['Firefox'].astype(float)
ydata4 = data['Safari'].astype(float)
ydata5 = data['Microsoft Edge'].astype(float)
ydata6 = data['Opera'].astype(float)
ydata7 = data['Mozilla'].astype(float)
ydata8 = data['Other/Unknown'].astype(float)
# 设置控件
extra_serie = {"tooltip": {"y_start": "There is ", "y_end": " min"}, "date_format": "%d %b %Y %H:%M:%S %p"}
# 添加数据
chart.add_serie(name='Google Chrome', y=ydata, x=xdata, extra=extra_serie)
chart.add_serie(name='Internet Explorer', y=ydata2, x=xdata, extra=extra_serie)
chart.add_serie(name='Firefox', y=ydata3, x=xdata, extra=extra_serie)
chart.add_serie(name='Safari', y=ydata4, x=xdata, extra=extra_serie)
chart.add_serie(name='Microsoft Edge', y=ydata5, x=xdata, extra=extra_serie)
chart.add_serie(name='Opera', y=ydata6, x=xdata, extra=extra_serie)
chart.add_serie(name='Mozilla', y=ydata7, x=xdata, extra=extra_serie)
chart.add_serie(name='Other/Unknown', y=ydata8, x=xdata, extra=extra_serie)
chart.buildhtml()
output_file = open('test_StackedAreaChart.html', 'w')
output_file.write(chart.htmlcontent)
output_file.close()

This stacked area chart is constructed from a TSV file storing the market share of several popular web browsers over the last year. Data is from Clicky Web Analytics. The chart employs conventional marginsand a number of D3 features: