检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
组件销毁前的回调函数,组件自己实现继承。 init 组件初始化入口API,以SelectWidgetTemplate组件为例,初始化组件通用能力,负责注册组件事件和组件动作。主逻辑建议如下: init() { this._super.apply(this, arguments);
Name' }, }, ], }, }, clickSeries字段对应组件{widget}.js文件中,注册的事件id。 window.Studio.registerEvents(this, 'clickSeries', { zh_CN:
data中。 fields[0].desc 变量的中英文描述,可选配置。 在组件的“global_SelectWidget.js”文件中,注册名称为“sendSelect”的事件。 示例代码如下: var global_SelectWidget = StudioWidgetWrapper
响应动作。本章节将向您介绍,如何实现组件响应动作。 注册动作 在响应动作中,单击“响应动作”,在下拉框中选择对应的响应动作。 图1 响应动作 /** * 文件global_SelectWidget.js中, 在init钩子中注册响应动作 * @params thisObj: 组件实例
如下: 单行生效:直接配置对应序号。 非连续性多行生效:使用中文逗号“,”或英文逗号“,”,分隔对应序号。 连续多行生效:使用横线“-”,连接首尾序号。 序列号 显示序列号:是否显示序列号。 宽度占比(%):设置序列号的宽度占比。 序列号样式:设置序列号的样式。 对齐方式:设置序列号的对齐方式。
单击玫瑰花饼图弹出页面二 图10 单击基本饼图弹出页面三 跳转外部页面 外部页面跳转和项目内部页面跳转类似,只是交互动作的选择项不同,同时需要填入外部页面的连接地址。 参考创建大屏&PC端项目中操作,新建一个大屏项目,如页面间交互。 参考使用空白画布新建页面中操作,新建一个空白页面,并拖入玫瑰花饼图。
{ if (cbk) { this._super(); cbk(); } }, }); // 注册组件,必填 window.Studio.registerWidget('EchartsWidgetTemplate', 'EchartsWidgetTemplate'
式,也可以使用图片。 节点样式:选择系统预置的里程碑样式,“里程碑样式”选择“预置”时,才会显示该参数。 选择图片:选择本地上传的图片或连接器中的图片,作为里程碑的样式。“里程碑样式”选择“图片”时,才会显示该参数。 图片宽度:设置所选择图片的宽度。“里程碑样式”选择“图片”时,才会显示该参数。
tab 配置项说明 表1 tab配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "tab" 配置项类型。 value String 否 value: "defaultValue" 默认值。 name String 是 name: "commProps
新建转换器 转换器是对数据集数据的再加工,为了将数据和组件更好的结合,以达到最佳的视觉展示效果。 为了便于您更好的使用转换器,华为云Astro大屏应用为您提供了盘古助手工具。盘古助手是由华为研发的基于盘古模型的AI助手,可以根据用户的需求,灵活地生成转换器代码,快速接入数据至大屏
radio 配置项说明 表1 radio配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "radio" 配置项类型。 value String 否 value: "defaultValue" 默认值。 name String 是 name: "commProps
新建getWarnDetailByStatus数据集 数据集名称:数据集的名称,用于标识该数据集。本示例配置为getWarnDetailByStatus。 数据源连接:选择1中创建的数据源。 目录:设置数据集的存放目录。 责任人:数据集的创建者。 描述:数据集的描述信息,通常设置为数据集的功能。 配置数据集,单击“保存”。
colorpicker 配置项说明 表1 colorpicker配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "colorpicker" 配置项类型。 value String 否 value: "defaultValue" 默认值。 name
checkbox 配置项说明 表1 checkbox配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "checkbox" 配置项类型。 value Boolean 否 value: true 默认值。 name String 是 name: "commProps
自定义围栏数据:地图自定义围栏数据桥接器,数据中省/直辖市code一致,则认为属于同一围栏区域。预览或发布页面时,单击围栏区域,地图会下钻到围栏区域。若未配置该连接器,则下钻到单独省/直辖市。 图12 自定义围栏数据 热力图层数据:热力图层数据桥接器/数据集,根据省/直辖市数值大小,热力图层颜色深浅不一。
switch 配置项说明 表1 switch配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "switch" 配置项类型。 value String 否 value: false 默认值。 name String 是 name: "commProps
time 配置项说明 表1 time配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "time" 配置项类型。 subType String 否 subType: "date" 子类型,支持的类型有time、date和datetime。 value
textarea 配置项说明 表1 textarea配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "textarea" 配置项类型。 value String 否 - 默认值。 name String 是 name: "commProps.myString"
slider 配置项说明 表1 slider配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "slider" 配置项类型。 value String 否 value: "defaultValue" 默认值。 name String 是 name:
{widget}.css 文件介绍 {widget}.css为组件的样式文件,在该文件中编写组件的CSS样式。 华为云Astro大屏应用的组件未进行打包编译,CSS样式可能存在互相影响的风险。因为,CSS选择器务必要加上组件id,通过组件id减少互相影响的可能。 文件示例 #EchartsWidgetTemplate