检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
自定义组件时，如何设置交互事件的输出变量 操作场景 开发者自定义组件时，可设置交互事件的输出变量，如图1所示，华为云Astro大屏应用支持将事件的输出变量（如“selectValue”）绑定页面级的全局变量（如“status”）。 图1 事件输出参数绑定全局变量 实现逻辑 自定义组件开发过
显示图例：是否显示图例，图例文字内容来源于数据模型下“s”的取值。 图例标记：设置图例小图标形状和图例列表布局朝向。 图例宽高：设置图例的宽度和高度。 图例间隔：设置图例之间的间隔。 字体：设置图例的字体、颜色和大小。 文字风格：设置图例文字的风格，支持正常、斜体和倾斜体。 图例位置(左)：图例
进度条颜色：设置进度条当前进度的颜色。 进度条背景色：设置进度条的背景颜色。 图标进度条：是否显示进度条图标。 图标样式：自定义图标样式。建议选择JPG、JPEG、PNG或GIF格式的图片，且每张图片的大小不能超过50MB。 图标宽：设置图标的宽度。 图标高：设置图标的高度。 图标位置：设置图标的显示位置，如进度条上方、进度条下方。
显示名称：自定义图表中系列的显示名称。 数据块颜色：数据块的颜色。 标签字体：设置标签的字体、文字大小、文字颜色等。 图例 图例是指在多维度可视化图形表达中，用以区分不同维度可视化图形的提示标识。 图6 基本漏斗图图例 显示图例：是否展示图例。图例文字内容来源于数据模型下“label”的值。 图例标记：设置图例小图标形状。
图表标题：设置为“显示”时，可自定义标题的内容、位置、字体大小和颜色等。 图形 图形是指组件中，实现数据可视化的具体图形表达元素，例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图6 满月饼图图形 颜色：设置组件中，图表的图形颜色。 统一配置 数据系列：是否显示该系列数据。如果不显示，会隐藏该组件中对应的系列数据。
如何通过全局变量，实现组件数据的动态变化 在华为云Astro大屏应用中，支持通过全局变量，来控制组件数据的动态显示。本章节以全局变量，控制地图组件中数据的动态显示为例进行介绍。 通过全局变量实现组件数据动态变化 参考关系型数据库数据源中操作，新建关系型数据库数据源。 图1 新建关系型数据库数据源
“s”的取值。 图例标记：设置图例小图标形状和图例列表布局朝向。 图例宽高：设置图例的宽度和高度。 图例间隔：设置图例之间的间隔。 字体：设置图例的字体、颜色和大小。图例文字内容来源于数据模型下“s”的取值。 左间距：图例到柱图组件左侧的距离。 上间距：图例到柱图组件顶部的距离。
等。 图形 图形是指组件中，实现数据可视化的具体图形表达元素，例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图6 基本饼图图形 颜色：设置图表中，图形的颜色。 统一配置：统一配置中设置的内容，对图表中所有数据系列均生效。 数据系列：图表是否显示数据系列。 南丁格尔图：是否使用南丁格尔图。
中获取。 图形 图形是指组件中，实现数据可视化的具体图形表达元素，例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图6 实心圆饼图图形 颜色：设置图表中，图形的颜色。 统一配置 数据系列：是否显示该系列数据。如果不选中，会隐藏该组件中对应的系列数据。 南丁格尔图：是否使用南丁格尔图。
高德地图图形 统一配置 显示范围：统一设置图层的显示范围，地图缩放级别在该范围内时，显示对应图层。 图层透明度：统一设置图层的透明度。 图层：单击“新增图层”，可新建图标图层、标签图层、柱状图层、飞线图层、基础热力图层和区域热力图层。 图9 新建图标图层 基本配置 类型：固定为“图标图层”。
数据标签最大值/最小值：是否显示柱状条数值的最大值或者最小值。 图例 图例是指在多维度可视化图形表达中，用以区分不同维度可视化图形的提示标识。 图7 双向柱图图例 显示图例：是否展示图例。图例文字内容来源于数据模型下“s”的取值。 图例标记：设置图例小图标形状。 图例宽高：设置图例的宽度和高度。 图例间隔：设置图例之间的间隔。
右边距：散点图到组件边框右侧的距离。 下边距：散点图到组件边框底部的距离。 左边距：散点图到组件边框左侧的距离。 图形 图形是指组件中，实现数据可视化的具体图形表达元素，例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图5 散点图图形 颜色：设置图表中图形的颜色。 统一配置
值颜色。 图例 图例是指在多维度可视化图形表达中，用以区分不同维度可视化图形的提示标识。 图7 基本柱图图例 显示图例：是否展示图例。图例文字内容来源于数据模型下“s”的取值。 图例标记：设置图例小图标形状。 图例宽高：设置图例的宽度和高度。 图例间隔：设置图例之间的间隔。 字体：设置图例的字体、颜色和大小等。
和后缀。 图例 图例是指在多维度可视化图形表达中，用以区分不同维度可视化图形的提示标识。 图7 瀑布柱图图例 显示图例：是否展示图例。图例文字内容来源于数据模型下“s”的取值。 图例标记：设置图例小图标形状。 图例宽高：设置图例的宽度和高度。 图例间隔：设置图例之间的间隔。 字体：设置图例的字体、颜色和大小等。
左、右，如图2）的距离，默认为0，即铺满整个组件。 配置 在配置中，设置地图组件的基本信息、热力图层、柱状图层和标签图层等。 图4 地图配置 地图基本配置 地图类型：地图第三方服务商，如天地图、高德地图和百度地图。 高德/百度/天地图密钥：地图第三方密钥，请自行到对应官网申请。
边框圆角：边框的圆角，四个角弧度取值范围为0~500，单位px。 图表背景：设置图表的背景颜色。 图形 图形是指组件中，实现数据可视化的具体图形表达元素，例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图4 热力图图形 颜色：设置图表中，图形的颜色。 热力颜色 在颜色设
均值。 图例 图例是指在多维度可视化图形表达中，用以区分不同维度可视化图形的提示标识。 图10 多区域折线图图例 显示图例：是否展示图例。图例文字内容来源于数据模型下“s”的取值。 图例标记：设置图例小图标形状。 图例宽高：设置图例的宽度和高度。 图例间隔：设置图例之间的间隔。
平均值。 图8 最终设置效果 图例 图例是指在多维度可视化图形表达中，用以区分不同维度可视化图形的提示标识。 图9 基本折线图图例 显示图例：是否展示图例。图例文字内容来源于数据模型下“s”的取值。 图例标记：设置图例小图标形状。 图例宽高：设置图例的宽度和高度。 图例间隔：设置图例之间的间隔。
后缀。 图例 图例是指在多维度可视化图形表达中，用以区分不同维度可视化图形的提示标识。 图7 水平基本柱图图例 显示图例：是否展示图例。图例文字内容来源于数据模型下“s”的取值。 图例标记：设置图例小图标形状。 图例宽高：设置图例的宽度和高度。 图例间隔：设置图例之间的间隔。 字体：设置图例的字体、颜色和大小。
颜色。 图例 图例是指在多维度可视化图形表达中，用以区分不同维度可视化图形的提示标识。 图7 数据标记柱图图例 显示图例：是否展示图例。图例文字内容来源于数据模型下“s”的取值。 图例标记：设置图例小图标形状。 图例宽高：设置图例的宽度和高度。 图例间隔：设置图例之间的间隔。 字体：设置图例的字体、颜色和大小等。
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
