java script teile auslagern

W

wpb

Erfahrenes Mitglied
Hallo!

Ich bin langsam schon am verzweifeln. Ich hoff es weiß er Rat... Also ich habe folgendes einfachs Beispiel. Hier ist mal der Link:
HTML: 
https://google-developers.appspot.com/chart/interactive/docs/gallery/areachart

HTML: 
<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Year', 'Sales', 'Expenses'],
          ['2004',  1000,      400],
          ['2005',  1170,      460],
          ['2006',  660,       1120],
          ['2007',  1030,      540]
        ]);

        var options = {
          title: 'Company Performance',
          hAxis: {title: 'Year',  titleTextStyle: {color: 'red'}}
        };

        var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

Den Teil function drawChart würde ich gerne in einer eigenen Datei haben, da ich die Daten über ein Application reinspiele. Ich bekomms einfach nicht hin...

Danke schon mal...
 
Was bekommst du denn nicht hin?
Die Funktion in eine Datei auslagern, diese einbinden.

meineJS-Datei.js
Code: 
function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Year', 'Sales', 'Expenses'],
          ['2004',  1000,      400],
          ['2005',  1170,      460],
          ['2006',  660,       1120],
          ['2007',  1030,      540]
        ]);

        var options = {
          title: 'Company Performance',
          hAxis: {title: 'Year',  titleTextStyle: {color: 'red'}}
        };

        var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }

HTML: 
<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript" src="meineJS-Datei.js" /></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>
 
Zuletzt bearbeitet:
Hallo!

Danke mal. Hab mich noch mal dazugesetzt, und hat jetzt funktioniert.
Hmmm. Was ich jetzt versucht habe ist den Inhalt dynamisch zu laden.

Ich habe jetzt 12 mal das .js File (pro Monat)
Wie geht ich das schön an, dass ich den Inhalt dynamisch lade.
Ich brächte eine Abfrage, und dann lade ich z.b.

meinJS_1 oder
meinJS_2 ...

Ich hab's nicht geschafft...

Danke
 
Einfach dynamisch aufbauen.
Eine Datei reicht dazu auch völlig aus.
Bau dir eine Funktion welche als Parameter den Monat mitbekommt und verarbeite dies im Script.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück