javascript - SAPUI5 draw google chart in newly created control (panel) by click -

I do not have much experience with JS but at the moment I have a work in which I need to create an HTML page and There is a Google Chart (Sapu 5 control) displayed on the panels. Page created with SAPUI5 elements:

  vertical layout | - Panel # 1 (open) | | - Grid layout. | - Panel 1 with Google Chart | | - Panel 2 with Google Chart | | - Panel . . | | - Panel with Google Charts N | - Panel # 2 (closed / collapsed). - Panel # 3 (closed / collapsed). -. . . | - Panel #m (closed / collapsed)  

I have no problem applying that argument. I page is loading and the charts are successfully drawing. The logic of the drawing chart of the next step is applied when the user opens any closed panels. I do this with the function:

  The collage buttons pressed (octrol event) {var panelID = oControlEvent.getParameter ("id"); PanelID = cutFromString (panel id, (panelID.length - sufixClpsBtn.length), panelID.length); Var oPanel = sap.ui.getCore (). ById (panelID); If (! OPanel.getCollapsed ()) {oPanel.setCollapsed (true); } And {oPanel.setCollapsed (wrong); If (oPanel.getContent (). Length == 0) {// A GridLayout in the main panel; Get data and new control $ Ax ({async: false, type: "GET", url: urlSAP, datatype: "Jason", Data: {"LT": "Extra", "TGID": Panel ID}, Get Success: Function (Odata) { Process Data 2 (OpenLine, Odata)}}); }}}  

In the function "processData_2" I am creating grid layouts and some panels based on the data I received.

  Function Process Data (OTIL Group, ODAB) {Var arrayoffides = []; // chart id (index) and divi id (array element value) where the chart should be kept var oGridTiles = new sap.ui.layout.Grid ({hSpacing: 1, vSpacing: 1}); Var Oitle; // Create panel to create (var i = 0; i & lt; oDAB.elems.length; i ++) {switch (oDAB.elems [i] .type) {case ("TILE"): oTile = CrtElement_Tile (ODAB) .elems [i] .title); Arrayoffides [oDAB.elems [i] .id] = string (otile) .split ("#") [1] + "-c"; OGridTiles.addContent (oTile); break; }} OTileGroup.addContent (oGridTiles); StartChartDrawing (oDAB.user, oDAB.elems, arrayOfIDs, False); }  

But the function "startChartDrawing" contains "unsolicited error in the script: the container for the line is not defined"

  chart1 = new google.visualization.ColumnChart ( "Document.getElementById (arrival [oCharts [i] .id]));  

By the time I try to attract the chart there, I can not understand the new panels Please help find a solution. There may be some incident that occurs when all the controls are created entirely.

I have found a solution that works fine for me. The last line of the methodology changed with Data_2 I

  oTileGroup.addContent; Var Handler = function () {Unbind ('DOMNodeInserted.myEvent'); StartChartDrawing (oDAB.elems, arrayOfIDs, incorrect);}; $ (document) .bind ('DOMNodeInserted.myEvent', handler);