创意展示:打造数据大屏的炫酷天气预报插件

发布时间:2023/12/08 18:12 发布者:Leo

返回博客中心

前言

随着数字化和信息化的发展,数据大屏的应用范围越来越广泛。我们不仅需要展示数据,还需要以更加美观的方式呈现数据。这必然需要使用各种图表组件,例如柱状图、饼图、折线图等等。然而,有些效果不太适合使用常规图表来实现,比如3D效果图表、组织结构、天气预报等特殊效果。对于这些特殊效果,我们可以通过自行开发来实现。今天,以葡萄城公司的嵌入式BI工具——Wyn商业智能为例,介绍如何制作一个天气预报插件。

插件开发

Wyn提供了用户自定义可视化插件开发的功能,使用者可以根据自身实际需求,自行开发符合其使用场景的漂亮可视化组件,从而丰富大屏的展示效果。

1. 获取代码

葡萄城公司官方公开了天气预报插件的源码,可以直接在github上获取:https://github.com/GrapeCityXA/Wyn-Custom-Visual/tree/main/天气预报

2. 代码打包

获取代码之后,在本地的IDE中通过wyn-visual-tools package命令将程序打包生成对应的VIZ插件包。

3. 上传组件

最后将插件包上传到Wyn中进行使用。首先在门户页面上选择"天气预报.viz"组件包。

选择组件之后,点击上传

4. 组件使用

组件上传之后就可以在仪表板中添加使用。

开发说明

1. 开源代码库

葡萄城将已经实现的可视化插件源码已经公开,可以直接在github中获取。比如上面的天气预报插件就是直接从官方的代码仓库中获取的,除此之外还有很多其他的插件供用户下载使用。下载源码、依赖之后就可以直接打包使用了。

2. 从零开始做一个插件

如果官方提供的插件没有需要的,就可以自己开始搭建项目工程,进一步开发插件。

2.1 准备环境

安装10.0.0 以上的版本的node.js 。

然后在IDE(如VS Code)中创建一个空白工程。

安装 wyn-visual-tools 命令集:npm i @grapecity/wyn-visual-tools -g

2.2 工程初始化

通过命令wyn-visual-tools init初始化项目环境,执行成功之后,可视化插件项目的基本工程框架就搭建出来了,后面继续按照框架结构进行开发即可。初始化后的项目结构如下:

  • assets:存储图片资源。目前仅支持图片,定义中所使用的图片将被编码为base64字符串。
  • i18nResources:此文件夹用于存放 i18n 文件。
  • node_modules: 该工程安装的依赖。
  • src/visual.ts:自定义可视化插件的入口。
  • capabilities.json:配置可视化插件的一些静态属性, 包括数据绑定,属性设置,操作栏的配置。
  • package.json/package-lock.json: 该项目的npm配置, 具体可以参考https://docs.npmjs.com/files/package.json
  • tsconfig.json: 该项目有关typescript的一些配置, 具体可以参考https://www.typescriptlang.org/docs/handbook/tsconfig-json.html
  • visual.d.ts: 可视化插件提供的一些接口定义。
  • visual.json:有关自定义可视化插件的一些元信息。
  • webpack.config.js: 该项目通过webpack进行打包,该文件是webpack的配置文件, 具体可参考https://webpack.js.org/configuration/

2.3 开发调试

我们在开发的过程中也不是一味的写代码,还需要根据当前的效果进行测试、修改、优化。在Wyn中也可以根据插件的情况进行调整。

首先,在Wyn的管理系统中开启开发者模式:

然后启动项目。

最后在仪表板设计器中就可以查看插件当前的效果。

打开仪表板设计器,在可视化插件模块中找到开发工具组件,拖动到设计器中,点击插件的右上角的刷新按钮,就能看到组件的呈现效果,同时在代码开发的IDE中可以看到运行时的日志信息。

3. 葡萄城市场

开发完后的插件不仅可以自己使用,还可以将开发完成的插件上传到葡萄城市场

总结

Wyn内置的图表组件非常丰富,可以满足大多数常见的使用场景,用户直接在葡萄城市场中下载并使用即可。除此之外,当遇到一些特殊的场景时,也可以根据自己的实际场景自己动手开发。希望每个读者在看完本文后,都可以设计出漂亮的仪表板大屏。


Wyn 商业智能软件| 下载试用

Wyn 是西安葡萄城自主研发的嵌入式商业智能软件,能帮助企业用户发现更多的数据潜在价值,为管理者制定决策提供数据支撑。Wyn 具备完整的嵌入式分析能力,能够与其他软件深度集成,也可独立部署使用,快速提升数据展示和分析能力。

Wyn 支持公有云、私有云和本地部署等多种部署方式,并能在Java、.net、PHP等开发平台中使用。您可以将其与ERP、CRM、OA等业务系统,以及钉钉、企业微信等APP进行深度集成,持续交付BI和报表功能,助力您的客户发现数据的价值。

了解更多关于 Wyn 嵌入式商业智能软件的内容,请点击此处访问官网,立即下载体验。