superset目前发布的版本是0.28,由于其存在多处已知bug,本文我选用的是最新的0.33版本。0.33版本和0.28版本的目录结构已经产生了很多区别,而且多数文件夹名称也被修改,网上的资源多数是基于0.28版本或者更旧的版本,并没有太大借鉴意义。以下流程以添加一个echarts的散点图为例,简述superset扩展图表的开发流程,希望能起到一定的帮助。
目录
三、在\superset\assets\src\visualizations下修改文件
四、在\superset\assets\src\explore\controlPanels下修改文件
一、为superset配置echarts
在superset\assets\packages.json中的“dependencies”中添加"echarts": "^4.2.0-rc.2",版本号就用自己的echarts版本号
由于echarts散点图需要使用到reactify,所以在这里我们顺手也加上reactify的修改
然后打开命令行终端,执行以下命令:
cd superset/assets npm install -d npm run dev |
二、修改viz.py文件
viz.py 这个文件起到一个类似于视图的功能,从前端接受请求后进行一系列处理。我们可以看到,一个图例就是一个类。经过分析已有的这些类,发现这些类大部分是继承了BaseViz这个基类,并且主要重写了query_obj和get_data这两个方法。其中query_obj,顾名思义,是用来构造查询条件的。而查询条件来源于页面左侧的组件,这些组件的信息存储在form_data的一个字典中,query_obj方法中将会处理form_data,构造除自己需要的查询条件并返回,在BaseViz这个基类中,会根据这个查询条件来查询出数据。然后是get_data方法,get_data接收一个参数df(pandas的DataFrame类型),也就是query_obj之后查询出来的数据,也可以结合你自己构造的form_data中的一些条件对df进行处理。处理之后的数据以dict格式返回,这个dict会交给js进行下一步处理,也就是展示了。
除了两个比较重要的方法之外,我们自定义的类还应该有两个重要的类属性viz_type和verbose_name。其中viz_type是标识当前类,也就是我们自定义图例的名称,注意这个名称应该与后面的js也结合起来。verbose_name则是相当于别名,展示在前端的。
因为我们添加的是一个时间序列的散点图,这里我们把类命名为TimeSeriesScatterViz
class TimeSeriesScatterViz(BaseViz): viz_type = 'time_series_scatter' verbose_name = "Time Series Scatter" sort_series = False is_timeseries = True def query |