组合 - grid
由jliang创建,最终由ydong 被浏览 67 用户
Grid
按网格指定多个chart组合布局
接口
- bigchart.Chart 定义查看 Chart文档
对于Grid(并行多图)的 _type="grid" 和 series_options:
bigcharts.Chart(
# 需要组合的图表,chart.page_title会用在tab标题 e.g. [chart1, chart2, chart3]
charts: List[bigcharts.Chart],
type_="grid",
series_options = {
# chart 索引id -> 配置
0: {
# 直角坐标系网格配置项,参见 `GridOpts`
grid_opts: Union[opts.GridOpts, dict],
# 直角坐标系网格索引
grid_index: int = 0,
# 是否由自己控制 Axis 索引
is_control_axis_index: bool = False,
},
}
)
其中
# 直角坐标系网格配置项 bigcharts.opts.GridOpts
class GridOpts(
# 是否显示直角坐标系网格。
is_show: bool = False,
# 所有图形的 zlevel 值。
z_level: Numeric = 0,
# 组件的所有图形的z值。
z: Numeric = 2,
# grid 组件离容器左侧的距离。
# left 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比,
# 也可以是 'left', 'center', 'right'。
# 如果 left 的值为'left', 'center', 'right',组件会根据相应的位置自动对齐。
pos_left: Union[Numeric, str, None] = None,
# grid 组件离容器上侧的距离。
# top 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比,
# 也可以是 'top', 'middle', 'bottom'。
# 如果 top 的值为'top', 'middle', 'bottom',组件会根据相应的位置自动对齐。
pos_top: Union[Numeric, str, None] = None,
# grid 组件离容器右侧的距离。
# right 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比。
pos_right: Union[Numeric, str, None] = None,
# grid 组件离容器下侧的距离。
# bottom 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比。
pos_bottom: Union[Numeric, str, None] = None,
# grid 组件的宽度。默认自适应。
width: Union[Numeric, str, None] = None,
# grid 组件的高度。默认自适应。
height: Union[Numeric, str, None] = None,
# grid 区域是否包含坐标轴的刻度标签。
is_contain_label: bool = False,
# 网格背景色,默认透明。
background_color: str = "transparent",
# 网格的边框颜色。支持的颜色格式同 backgroundColor。
border_color: str = "#ccc",
# 网格的边框线宽。
border_width: Numeric = 1,
# 图形阴影的模糊大小
shadow_blur: Optional[Numeric] = None,
# 阴影颜色
shadow_color: Optional[str] = None,
# 阴影水平方向上的偏移距离
shadow_offset_x: Numeric = 0,
# 阴影垂直方向上的偏移距离
shadow_offset_y: Numeric = 0,
# 本坐标系特定的 tooltip 设定。
tooltip_opts: Union[TooltipOpts, dict, None] = None,
)
示例代码
https://bigquant.com/codeshare/84f0bbac-1b90-44b5-a68e-9ac9514c3384
\