jquery - Chart hent data - Udvikleren.dk - Programmering, webdesign og grafik

Tags: jquery

<< < 1 2 > >>

Bruger #17509 @ 25.11.14 19:41

Jeg forsøger at hente data fra et PHP script.

Men jeg kan ikke indsætte dataerne i en variable.. Min kode ser således ud:

Som et eksemple, kan jeg indsætte i chartdata fra selve scriptet:

[{device:'Safari',geekbench:136},{device:'Chrome',geekbench:137},{device:'IE',geekbench:275},{device:'Firefox',geekbench:380},{device:'Opera',geekbench:655},{device:'Android',geekbench:1571},{device:'iPhone',geekbench:655},{device:'Andet',geekbench:1571}]

Og det virker fint, men når jeg skal hente det virker det ikke...
Min PHP fil, er bare noget der echo'er overstående kode.

JScript kode

 var chartdata = [];
             
             $.ajax({
             type:'get',
             dataType:'json',
             url:'http://localhost/statistics/get_browser_visits',
             success: function(data) {
                 
                 chartdata = data
                 }
             });
 
 
 function initMorris(){Morris.Bar({element:'hero-bar',data:chartdata,xkey:'device',ykeys:['geekbench'],labels:['Geekbench'],barRatio:0.4,xLabelAngle:35,hideHover:'auto',resize:true,barColors:['#20aae5']});}

15 svar postet i denne tråd vises herunder
2 indlæg har modtaget i alt 7 karma

Sorter efter stemmer Sorter efter dato

Bruger #17509 @ 25.11.14 21:39

Den virker også, problemet ligger i at der ikke bliver gemt nogen variable, jeg kan indsætte i charten?

Bruger #4879 @ 25.11.14 21:47

227

Ok. Hvis du har rettet dit JSON, og den ikke længere kommer med fejl, så skulle der gerne være data i chartdata-variablen.
Men bemærk, at get-kaldet laves asynkront og success-funktionen køres først, når kaldet er gennemført (uden fejl).
Hvis du kører initMorris inden success-funktionen er blevet kaldt, så vil chartdata-variablen være tom.

Prøv følgende og fortæl mig, hvad der står i konsollen.

JScript kode

 function initMorris(chartdata) {
      console.log('initMorris');
      Morris.Bar({element:'hero-bar',data:chartdata,xkey:'device',ykeys:['geekbench'],labels:['Geekbench'],barRatio:0.4,xLabelAngle:35,hideHover:'auto',resize:true,barColors:['#20aae5']});
 }
 
 console.log('get-kald påbegyndes');
 
 $.ajax({
     type:'get',
     dataType:'json',
     url:'http://localhost/statistics/get_browser_visits',
     success: function(data) {
         console.log('success');
         initMorris(data);
     }
 });

Indlæg senest redigeret d. 25.11.2014 21:47 af Bruger #4879

Bruger #17509 @ 25.11.14 21:50

Det her er resultatet:

Get kald køre
Kan ikke finde morris
Success

Vil det sige den henter morris før den henter variable ?

Bruger #17509 @ 26.11.14 08:38

Javascript kode:

JScript kode

 var chartdata = [];
 
 function initMorris(){Morris.Bar({element:'hero-bar',data:chartdata,xkey:'device',ykeys:['geekbench'],labels:['Geekbench'],barRatio:0.4,xLabelAngle:35,hideHover:'auto',resize:true,barColors:['#20aae5']});}
 return{init:function(){events();initFlot();initSparkchart();initEastPie();initMorris();}};}();$(function(){"use strict";charts.init();});
 console.log('get-kald påbegyndes');
 
  $.ajax({
      type:'get',
      dataType:'json',
      url:'http://localhost/statistics/get_browser_visits',
      success: function(data) {
          chartdata = data;
      }
  });

Her er et billede af min konsol:

https://billedeupload.dk/images/d6gmJ.png

Bruger #17509 @ 26.11.14 10:32

Nu virker det, tusind mange tak!

<< < 1 2 > >>

Chart hent data

Karma barometer (30 dage)

Modtaget

Givet

Favorit hos
Forum tråde
Artikler