每隔一段时间，你可能会发现自己想要扩展SAPUI5的视觉极限。幸运的是，SAPUI5提供了使用其他控件库的选项。原则上，这应该是相当直接的。第三方控件库中的一些甚至构建在jQuery上，因此与UI5共享相同的基础。原则上，将它们包含在UI5应用程序中应该很容易。
然而，在现实生活中，大多数这样的第三方控件库需要一些调整，以便在UI5环境中无缝集成。使用XML视图时尤其如此，这是创建UI5应用程序的首选方法。SAPUI5中的XML视图可能会对第三方控件所需的相关控制器Javascript代码产生一些"奇怪"的影响。此外，主要第三方控件库的大多数文档引用的是Javascript视图，而不是XML，这一事实可能会带来有趣的挑战。
本博客旨在提供一个与在SAPUI5中使用Kendo UI框架控件相关的挑战和陷阱的演练。我将重点介绍一些简单的图表实现，hadoop大数据，并展示如何在XML视图中使用这些实现。另外，我将演示如何使用OData将远程数据输入图表控件。
注意：一些代码截图可能难以阅读；请单击它们以放大！
以下示例是使用HANA云平台上的Web IDE创建的–HCP。在Web IDE中，选择New->Project from template->SAPUI5 Application。这将为您提供一个带有一个视图的简单UI5应用程序（应为XML类型）。
下一步是将CSS和Javascript库导入应用程序。不建议使用对web内容的引用，因为在某些情况下（例如从Fiori启动板运行应用程序时）这可能会导致跨域错误。
这是带有Kendo JS和CSS库的文件夹结构：
我们将基于示例OData服务创建一个简单的应用程序，并实现一个Kendo图表控件来可视化数据。剑道图表控件提供了一系列不同的图表类型；我将展示其中几个。功能类似–一旦实现了一个，就可以轻松地切换到另一个。
OData服务驻留在Netweaver网关系统上。为了便于说明，我创建了一个简单的表格，显示了僵尸观测在美国的分布情况。（使用zombie的另一个显著优点是zombie以字母"Z"开头，这使得它对于创建自定义SAP对象（如"zombietable"）特别有用。
基于我的zombie表的OData服务是在网关生成器（transaction SEGW）中创建的。这超出了本博客的范围；SAP Press有一本关于这些主题的好书。
我的OData服务的结果元数据（摘录）：
和产生的僵尸集记录集的一部分：
随着我们的OData服务的建立和运行，是时候做一些有趣的事情了：UI5中的剑道应用程序。
如前所述，我首先使用WebIDE向导创建了一个简单的UI5项目。向导为我们的应用程序提供了所需的文件夹结构，我们还可以要求它生成第一个视图（应该是XML类型）。XML视图的优势在于，它迫使我们遵循MVC模式，而Javascript视图允许在视图代码中嵌入任何类型的Javascript功能。（不要使用Javascript视图，北京大数据公司，使用XML！成年人从不使用Javascript视图！！）
如果我们遵循向导的建议，我们最终会得到一个名为"View1"的初始视图和一个相关的控制器。
我已经提到需要将剑道CSS和Javascript文件导入到它们的特定文件夹中（CSS文件的现有CSS文件夹，以及剑道JS文件到特定文件夹中）。完成后，我们需要在清单.json文件：
文件清单.json文件是一个JSON模型，它充当应用程序资源的"存储库"。它应该已经包含对ui5css文件（css）的引用/样式表)；我们只需要添加其余的剑道CSS引用，以及剑道Javascript文件的特定部分，如上图所示。这样，就不需要在中引用这些资源索引.html
我们的XMLview文件将非常简单。它所包含的只是一个"div"元素，它保存了我们的剑道图（还有另一个div来封装它）。这是密码：
就是这样-真的。我保证控制器会更复杂一点！
为了包含剑道UI控件，我们需要在视图控制器中嵌入一些剑道Javascript代码。剑道UI站点包含所有剑道控件的示例代码。理想情况下，我们所要做的就是复制与"我们的"控件（本例中的剑道图）相关的代码并将其粘贴到视图控制器中。然而，还有两个主要的障碍在等着我们：一个是我们使用XML视图，另一个是Kendo控件只能处理JSON数据。因为我们在SAP环境中，所以我们当然使用OData，正如前面提到的，我们还决定坚持使用XML视图。
这两个障碍都需要对剑道代码进行一些调整。
让我们看看条形图的标准剑道代码：
这是一个摘录。我们可以看到，这里的数据源是一个JSON模型。这对我们不起作用；我们接收OData格式的远程数据，我们需要做的是将其转换为JSON。
幸运的是，好淘客，使用SAPUI5这很容易–我们马上就会看到。
这里是控制器代码，一节一节。
