'Cannot read property 'DataTable' of undefined' Implementing Google Chart into my SAPUI5 project.

[former_member595185]

Hi,

I'm trying to implement the calendar chart from the google chart library https://developers.google.com/chart/interactive/docs/gallery/calendar

However, when I try to implement it, I seem to get an error 'Cannot read property 'DataTable' of undefined'

After carefully debugging, I have found out that the library itself DOES load as I can use certain google code however, it is missing a file called 'library-preload.js' when calling the chart function.

'failed to load 'lib/googleChart/library-preload' (failed to load 'lib/googleChart/library-preload.js' from /webapp/lib/googleChart/library-preload.js:' I have tried multiple ways of implementing the library just in case this was the problem such as implementing the library via HTML and into the manifest.json file, however, I still get the same error.

Many thanks.

Attached as listed;

- code where the library is loaded.

- Init

- the function called to load the chart (line 3 is where i get the error - 'Cannot read property 'DataTable' of undefined')

- Screenshot of Library directory

- Screenshot of the error in debugger

sap.ui.getCore().loadLibrary("lib.googleChart", "/webapp/lib/googleChart/");

		onInit: function () {
			
		google.charts.load("current", {packages:["calendar"]}); 
		google.charts.setOnLoadCallback(this.drawChart()); 
			
		},

               drawChart: function() {
		debugger;
	       var dataTable = new google.visualization.DataTable();
 //...
	       dataTable.addColumn({ type: 'date', id: 'Date' });
	       dataTable.addColumn({ type: 'number', id: 'Won/Loss' });
	       dataTable.addRows([
	          [ new Date(2012, 3, 13), 37032 ],
	          [ new Date(2012, 3, 14), 38024 ],
	          [ new Date(2012, 3, 15), 38024 ],
	          [ new Date(2012, 3, 16), 38108 ],
	          [ new Date(2012, 3, 17), 38229 ],
	          // Many rows omitted for brevity.
	          [ new Date(2013, 9, 4), 38177 ],
	          [ new Date(2013, 9, 5), 38705 ],
	          [ new Date(2013, 9, 12), 38210 ],
	          [ new Date(2013, 9, 13), 38029 ],
	          [ new Date(2013, 9, 19), 38823 ],
	          [ new Date(2013, 9, 23), 38345 ],
	          [ new Date(2013, 9, 24), 38436 ],
	          [ new Date(2013, 9, 30), 38447 ]
	        ]);
	       var calender = this.getView().byId("calenderChart");
	       //var chart = new google.visualization.Calendar(calender);
	       var options = {
	         title: "Red Sox Attendance",
	         height: 350,
	       };
	
	       chart.draw(dataTable, options);
	   },