正在生成
详细信息:
检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
checkbox 配置项说明 表1 checkbox配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "checkbox" 配置项类型。 value Boolean 否 value: true 默认值。 name String 是 name: "commProps
ROMA连接器数据源 操作场景 第三方接口或服务通过配置为ROMA连接器的方式,接入外部数据。 操作步骤 参考登录AstroCanvas界面中操作,登录AstroCanvas界面。 在主菜单中,选择“数据中心”。 在左侧导航栏中,选择“数据源”。 在数据源管理页面,单击“新建数据源”。
HTTP连接器数据源 前提条件 参考新建连接器中操作,创建HTTP连接器。 操作步骤 参考登录AstroCanvas界面中操作,登录AstroCanvas界面。 在主菜单中,选择“数据中心”。 在左侧导航栏中,选择“数据源”。 在数据源管理页面,单击“新建数据源”。 选择“HTTP连接器”,配置数据源参数。
tab 配置项说明 表1 tab配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "tab" 配置项类型。 value String 否 value: "defaultValue" 默认值。 name String 是 name: "commProps
架构名称:MS SQL Server数据库的架构名称。当“数据库类型”配置为“MS SQL Server”时,该参数才会显示。 用户名:登录数据库的用户名。 密码:登录数据库用户对应的密码。 数据库名称:数据库实例名称。“数据库类型”为“GaussDB 100”时,不需要配置该参数。 描述:新建数据源的描述信息。
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
list 配置项说明 表1 list配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "list" 配置项类型。 name String 是 name:"intervalColors" 双向绑定list名称。 label Object 否 label:
设置计数器允许的最大值,默认值为Infinity。 事件 表2 事件 事件名称 调用配置项中的方法 说明 回调参数 change change 仅在输入框失去焦点或用户按下回车时触发 (data, field) blur blur 在输入框获得焦点时触发 (value, data, field) focus
{widget}.js 文件介绍 {widget}.js为组件逻辑文件,整个Widget的渲染核心JS,在组件编辑状态和页面最终的发布运行态都会被加载执行。一个推荐的组件架构,应包含表1中API。其中,init、render和beforeDestory为组件的通用生命周期函数,其余为推荐模板实现。
colorpicker 配置项说明 表1 colorpicker配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "colorpicker" 配置项类型。 value String 否 value: "defaultValue" 默认值。 name
如何通过全局变量,实现组件数据的动态变化 操作场景 在AstroCanvas中,支持通过全局变量,来控制组件数据的动态显示。本章节以全局变量,控制地图组件中数据的动态显示为例进行介绍。 操作步骤 参考关系型数据库数据源中操作,新建关系型数据库数据源。 图1 新建关系型数据库数据源
slider 配置项说明 表1 slider配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "slider" 配置项类型。 value String 否 value: "defaultValue" 默认值。 name String 是 name:
单击“+响应动作”,选择“页面跳转”,跳转到外部页面,外部页面地址引用全局变量,设置为“${url}”,弹出新窗口打开页面地址,单击“确定”。 单击“完成”,设置后用户在单击柱图数据时,会跳转到数据集中设置的具体url页面。 图4 设置页面跳转 设置完成后,单击页面上方的,保存页面。 保存成功后,单击,预览效果是否符合预期。
三角形水位图 三角形水位图是水位图的一种,用于匹配不同风格、场景的大屏面板。 在大屏设计页面,从“全部组件 > 图表”中,拖拽“三角形水位图”组件至画布空白区域,如图1。 图1 三角形水位图 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素
自定义组件时,如何设置交互事件的输出变量 操作场景 开发者自定义组件时,可设置交互事件的输出变量,如图1所示,AstroCanvas支持将事件的输出变量(如“selectValue”)绑定页面级的全局变量(如“status”)。 图1 事件输出参数绑定全局变量 实现逻辑 自定义组
复制数据集到其它工作空间 操作场景 创建同类型数据集时,通过“复制到工作空间”功能,可快速复制数据集到目标工作空间,减少重复操作,提升开发效率。 操作步骤 参考登录AstroCanvas界面中操作,登录AstroCanvas界面。 在主菜单中,选择“数据中心”。 在左侧导航栏中,选择“数据集
{widget}.css 文件介绍 {widget}.css为组件的样式文件,在该文件中编写组件的CSS样式。AstroCanvas的组件未进行打包编译,CSS样式可能存在互相影响的风险。因为,CSS选择器务必要加上组件id,通过组件id减少互相影响的可能。 文件示例 #EchartsWidgetTemplate
{widget}.ftl 文件介绍 {widget}.html为组件DOM结构文件,需要在服务端提前渲染的部分,可以写在此文件中,相当于HTML文件,负责样式展示。 文件示例 <div id="EchartsWidgetTemplate" v-cloak> <div ref="echartsDom"
通过AstroCanvas中预置的交通管理模板,快速创建一个可视化大屏页面。 预览并发布大屏页面 在线预览大屏页面效果,确保开发编辑效果与发布后运行效果一致。预览效果符合预期后,可直接发布大屏页面,并在线查看城市交通状况。 步骤一:注册账号并实名认证 使用AstroCanvas前,需要先注册