手机版 欢迎访问魄力云云市场资讯网站

当前位置:主页 > 虚拟主机 >

企业邮箱_购买云服务器_优惠券

时间:2021-09-28 16:15:01|来源:魄力云|编辑:魄力云|点击:

嘿,社区!

我使用SAPUI5框架图已经有一段时间了。今天我将分享一些关于VizFrame图表的提示和如何指导。

这篇文章假设您可以在WebIDE/Eclipse中设置一个SAPUI5项目。

测试用例:假设您拥有一辆冰淇淋卡车,并且您正在构建一个仪表板来查看不同口味的销售情况(我下次会举一个更好的例子)。

因此,让我们开始…

1.选择图表类型

访问SAPUI5演示套件,选择适合您需求的图表类型。

https://sapui5.netweaver.ondemand.com/#/entity/sap.viz.ui5.controls.VizFrame

对于这个博客,我们将使用饼图(你可能厌倦了看到饼图的例子,但请和我一起讨论这个问题)。

2.始终使用饼图图表容器!链接

这是一个专门为保存图表而构建的控件,提供额外但重要的功能,例如提供一个工具栏,具有缩放、全屏显示、切换图例、在图表类型之间切换和更改图表尺寸等通用功能。

因此,在您的视图中添加以下内容:

3。让我们决定要显示的数据。

我们将考虑以下类型的记录数组。

4。添加饼图。

在""视图中添加以下内容:

并在控制器中添加此内容:

提示:

当您要使用OData时,网购返利,在控制器中动态设置FlattedDataSet的绑定,这将有助于避免OData调用为空。

输出:

5。外观上的小变化…

在饼图中显示"销售值",而不是"百分比"将图例位置更改为左侧。给图表一个3D ishh(光泽)的外观

以上所有都可以通过更新vizFrame的vizProperties属性来实现:

在您的视图中更改vizProperties属性:

输出:

6。更新颜色口味

饼图中显示的颜色与冰淇淋口味完全无关。默认显示以下标准颜色

因此,您可以根据您的数据值覆盖并添加颜色,在本例中,请在\u setIceCreamModel函数中添加以下颜色

请注意,颜色中的颜色将按照记录的顺序绘制,i、 e.在我们的例子中,"蓝月亮"作为第一条记录出现,因此"#5bbae7"将按顺序为"蓝月亮"绘制,其余项目相同。

输出:

7。显示值的自定义格式化程序

显示值的格式化是必须的!

例如,在一个幸运的月份,你卖出了价值超过1356000英镑的冰淇淋(比如说黑电流)

输出会是这样:

所以我们不能按原样显示这个值,它的格式应该是135万或1.35米

为了实现这一点,大数据怎么学,大数据应用前景,我们可以使用属性formatString。这里有一些标准格式,您可以探索:

https://sapui5.hana.ondemand.com/#/api/sap.viz.ui5.format.ChartFormatter.DefaultPattern

但是!我们可以创建自己的格式化程序,为此在控制器中添加以下函数,企业大数据分析,并在onInit()方法中调用此函数。这将注册一个自定义格式化程序。

要使上述代码正常工作,请不要忘记在中添加ChartFormatter和格式化程序依赖项sap.ui.define同样的参考。

现在要看到这一点,你只需要更新你的万能财产"vizProperties"

现在:

整洁!正确的?

8. Popover

最后但并非最不重要的是vizframe Popover,在我们的例子中,我们显示的是格式化的值,但我们也想查看原始值,这里Popover来解救。

创建一个Popover并将其附加到vizframe。

还有,您可以使用setFormatString方法来决定popover显示的格式字符串。

输出:点击饼图将显示popover。

仅此而已!

另外,返现app,请查看Fiori设计指南:https://experience.sap.com/fiori-design-web/chart/

希望你喜欢这个帖子

云主机服务商 Ucloud云计算 移动云数据 云存储服务器 Ucloud云主机 云计算提供商 阿里数据库 服务器租用 云储存服务器 Web云服务器 ucloud云数据库 独享云主机 云服务器服务商 海外云存储 云服务器主机 云计算解决方案 国内云存储 数据库云平台

Copyright © 2002-2020 魄力云 版权所有

备案号:豫ICP备56298345号