I’m trying to use a sap.viz.ui5.StackedColumn chart in custom component. I’m not familiar with SAPUI5 (Or custom components) so to get the hang of SAPUI5 I created an html page that used sap.viz.ui5.StackedColumn to create a static graph. When that was done I created a custom component using the design studio SDK and basically copied the javascript from my HTML page in the component javascript file.
Initially when I pull my chart component into my dashboard and try to run it I got an error like: “Unable to get property 'ui5' of undefined or null reference”. To get around that I imported the sap.viz.library by placing jQuery.sap.require("sap.viz.library"); at the top of my .js file. After doing that it worked fine. I can see and interact with my graph.
The issue comes when I try to include other ‘built in’ charts into my dashboard. If I take my working dashboard with my custom charting component and then drag in a Chart (One of the built in Analytic Components) and then try to run the dashboard I get the following error:
failed to load 'sap/viz/library.js' from resources/~1416505264634~/sap/viz/library.js: Error: failed to load 'sap/viz/libs/sap-viz.js' from resources/~1416505264634~/sap/viz/libs/sap-viz.js: TypeError: Cannot modify non-writable property 'VERSION'
This error is coming as a result of the jQuery.sap.require("sap.viz.library"); call in my custom components js file.
When looking at the network traffic I do see that the resources/~1416505264634~/sap/viz/library.js is requested and successfully pulled in at some time, same with the resources/~1416505264634~/sap/viz/libs/sap-viz.js file.
Does any one have any idea on this? I need to get my custom component working on the same page as other charts and I’d appreciate any input.
Thank you