Forum | Appery.io

Hi, I'm not an expert programming and I'm not undertanding very well how I can have reference to an external Javascript Library. For example I want to draw a chart using google charts, when I copy and paste the code below in a HTML panel it works:

 PresidentVice President 

• but if for example I wanna place the second script out of the HTML I create a blank Javascritp file and I paste the script:

  google.load('visualization', '1', {packages:['orgchart']});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'Name');
  data.addColumn('string', 'Manager');
  data.addColumn('string', 'ToolTip');
  data.addRows([
  [{v:'Mike', f:'MikePresident'}, '', 'The President'],
  [{v:'Jim', f:'JimVice President'}, 'Mike', 'VP'],
  ['Alice', 'Mike', ''],
  ['Bob', 'Jim', 'Bob Sponge'],
  ['Carol', 'Bob', '']
  ]);
  var chart = new google.visualization.OrgChart(document.getElementById('chart_div'));
  chart.draw(data, {allowHtml:true});
  }

  • leaving in the HTML panel only this code:

• but the chart doesn't load. What am I doing wrong?, How can I reference to that Javascript file that I created?

  Many Thanks

When you put it inside the page, the script runs when the page is loaded.

When you put it in a file, you need to invoke the script from somewhere, such as a page.

Many thanks Max, but in that example, how could I invoke that script?

Put it in a function and invoke the function (from button click for example). You would also need to define the div. See the line before last.