气泡图”图形按钮，可将气泡图添加到大屏中。 图2 选择组件 单击画布中的组件，在右侧选择“样式”页签，显示和配置组件的样式。 本示例使用默认的样式，如需了解更多样式配置，请参见设置组件样式。 图3 配置组件样式 在右侧选择“数据”页签，配置组件的数据。 本示例使用静态数据，如需了解更多数据配置，请参见设置组件数据。

查看更多 →

主题 AstroZero预置了很多默认样式，供您选择使用，同时也支持对标准页面的主题样式进行自定义修改。自定义主题时，可以自定义修改标准页面的样式。设置完成并启用主题后，该应用中标准页面相同组件的展示，将以主题中配置的为准。 自定义主题样式需要您熟悉 CSS 的Less代码编写规范，关于Less介绍，请参见Less介绍。

查看更多 →

其它”中，拖拽“按钮组件”组件至画布空白区域，如图1所示。 图1 按钮组件 配置 在配置中，设置按钮快捷样式和基础样式。 图2 配置 快捷样式设置：设置按钮的样式，如常规按钮、强调按钮、文字按钮等。 基础样式设置 按钮：按钮状态，分为启用和禁用。 内容：按钮显示文字，如保存。 默认文字：按钮显示

查看更多 →

分割线 分割线为样式型组件，用于分割字段，起装饰作用。 在左侧组件区域，选择“分割线”组件，并拖拽至设计区域，如图1所示。 图1 拖拽分割线组件到设计区并设置属性 基础配置 文本：设置分割线上显示的文字。输入内容不得超过32个字符。 分割线样式：选择分割线的样式，如虚线、点线、双线或实线。

查看更多 →

背景色：水位图的背景颜色。 边框：组件卡片边框设置，支持无边框、全边框和角边框三种样式。设置为全边框和角边框时，支持设置组件外圈边框的线型、圆角等。 样式：选择图片时，图片显示的样式，支持普通、居中、拉伸和平铺四种样式。 选择图片：使用本地的图片作为组件背景，支持新增目录和子目录，便于对图

查看更多 →

水平对齐方式：设置“容器”内拖入的组件对齐方式，提供左对齐、居中、右对齐三种对齐方式。 高级 样式 样式类：当前组件使用的 CS S样式类名，可在CSS代码中进行引用。 样式：使用CSS代码自定义组件样式。自定义代码支持多行输入，并高亮显示样式参数。 事件：在事件中，显示了组件暴露出来的一些常用事件，供用户实现

查看更多 →

单击“创建自定义菜单”，编辑菜单。输入菜单名称，选择样式，如所示。 图4 选择样式 单击“”，菜单内容中显示该样式的HTML代码，可以在此基础上进行编写代码，如图5所示。 图5 编辑代码 也可以不选择样式，选择自定义样式，编辑HTML内容，如图6所示。 图6 自定义代码 其余菜单样式、链接、属性等设置方法跟

查看更多 →

水平正负柱图 样式 尺寸位置 图表尺寸：设置图表的宽和高。单位为px。 图表位置：设置图表在画布中的位置。单位为px。 全局样式 字体：设置图表中文字的字体。 柱子样式 柱子宽度：设置柱子的宽度。 柱子圆角度：设置柱子的圆角度。 系列间距：设置多个系列间的距离。 图2 柱子样式-水平正负柱图

查看更多 →

WT雷达图 本章节主要介绍WT雷达图组件各配置项的含义。 样式 WT雷达图和雷达图的样式配置相似，请参考样式配置WT雷达图的样式。 数据 WT雷达图和WT柱图的数据配置相似，请参考数据配置WT雷达图的数据。 交互 关于组件是否支持交互功能及交互的使用方法，请参考设置组件事件交互。

查看更多 →

WT水平柱图 本章节主要介绍WT水平柱图组件各配置项的含义。 样式 WT水平柱图和水平柱状图的样式配置相似，请参考样式配置WT水平柱图的样式。 数据 WT水平柱图和WT柱图的数据配置相似，请参考数据配置WT水平柱图的数据。 交互 关于组件是否支持交互功能及交互的使用方法，请参考设置组件事件交互。

查看更多 →

WT散点图 本章节主要介绍WT散点图组件各配置项的含义。 样式 WT散点图和散点图的样式配置相似，请参考样式配置WT散点图的样式。 数据 WT散点图和WT柱图的数据配置相似，请参考数据配置WT散点图的数据。 交互 关于组件是否支持交互功能及交互的使用方法，请参考设置组件事件交互。

查看更多 →

时间器 本章节主要介绍时间器组件各配置项的含义。 样式 尺寸位置 图表尺寸：设置图表的宽和高。单位为px。 图表位置：设置图表在画布中的位置。单位为px。 图1 时间器 图标样式 字号：设置组件时间图标的字号大小。 颜色：设置组件时间图标的颜色。 右边距：输入数值或拖动，调整组件时间图标的右边距。

查看更多 →

本章节主要介绍扫描雷达组件各配置项的含义。 样式 尺寸位置 图表尺寸：设置图表的宽和高。单位为px。 图表位置：设置图表在画布中的位置。单位为px。 图1 尺寸位置-扫描雷达 全局样式 字体：设置图表中文字的字体。 半径：输入数值或通过拖动设置半径大小。 值标签：设置图表中文字的文本样式，包括字号大小、字体颜色、字体粗细样式。

查看更多 →

箭头水位图 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构，可以理解为组件由卡片中基础元素（卡片标题、图表、卡片背景、卡片边框）和图表元素构成。 图3 卡片 卡片装饰：卡片装饰设置，可根据自身的业务需求选择不同的卡片样式。单击“清除样式”，可清除已设置的装饰样式。 标题 标题：是否显示该组件标题。

查看更多 →

圆角矩形水位图 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构，可以理解为组件由卡片中基础元素（卡片标题、图表、卡片背景、卡片边框）和图表元素构成。 图3 卡片 卡片装饰：卡片装饰设置，可根据自身的业务需求选择不同的卡片样式。单击“清除样式”，可清除已设置的装饰样式。 标题 标题：是否显示该组件标题。

查看更多 →

边框 本章节主要介绍边框组件各配置项的含义。 样式 尺寸位置 图表尺寸：设置图表的宽和高。单位为px。 图表位置：设置图表在画布中的位置。单位为px。 图1 边框 样式 设置边框的样式，系统已预置多种样式供用户选择。 数据 此组件没有数据事件。 交互 关于组件是否支持交互功能及交互的使用方法，请参考设置组件事件交互。

查看更多 →

默认展开全部：默认展开所有面板内容。 字体：设置字体样式。 背景：设置折叠面板背景色。 高级 样式 样式类：当前组件使用的CSS样式类名，可在CSS代码中进行引用。 样式：使用CSS代码自定义组件样式。自定义代码支持多行输入，并高亮显示样式参数。 事件：在事件中，显示了组件暴露出来的一

查看更多 →

{widget}.css 文件介绍 {widget}.css为组件的样式文件，在该文件中编写组件的CSS样式。 AstroCanvas的组件未进行打包编译，CSS样式可能存在互相影响的风险。因为，CSS选择器务必要加上组件id，通过组件id减少互相影响的可能。 文件示例 #EchartsWidgetTemplate

查看更多 →

隐藏：是否隐藏该组件。 样式 布局：设置组件的宽度、高度等。 字体：设置字体大小、字体样式、颜色等。 背景：设置背景颜色、透明度。 边框：设置边框颜色、宽度等，单位为px。 阴影：设置阴影颜色、模糊、扩散等，单位为px。 高级设置 样式源码：组件具体样式代码，组件样式设置后，样式代码将自动显

查看更多 →

隐藏：是否隐藏该组件。 样式 布局：设置组件的宽度、高度等。 字体：设置字体大小、字体样式、颜色等。 背景：设置背景颜色、透明度。 边框：设置边框颜色、宽度等，单位为px。 阴影：设置阴影颜色、模糊、扩散等，单位为px。 高级设置 样式源码：组件具体样式代码，组件样式设置后，样式代码将自动显

查看更多 →

页签组件不支持嵌套到页签中。 图2 设计页签布局 基础配置 样式：设置页签组件的样式。 图3 设置页签样式 页签选项：页签组件中，各Tab页面设置。支持设置页签标题，并拖入组件到对应的页签中，选中组件可配置对应页签下的组件属性。 图4 设置页签 样式配置 内间距：设置容器内组件与容器四边的间距，

查看更多 →