load data from text file into chart - Javascript highcharts

Javascript examples for highcharts:Chart Data

  1. HOME
  2. Javascript
  3. highcharts
  4. Chart Data

Description

load data from text file into chart

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript" src="https://code.jquery.com/jquery-1.8.3.js"></script> 
   </head> 
   <body> 
      <div id="PMTA4" style="height: 400px; min-width: 600px"></div> 
      <script src="https://code.highcharts.com/stock/highstock.js"></script> 
      <script src="https://code.highcharts.com/stock/modules/exporting.js"></script> 
      <script type="text/javascript" src="https://www.highcharts.com/samples/data/usdeur.js"></script> 
      <script type="text/javascript">
var options = {/*from   ww  w . ja  v a 2s . c  o m*/
    chart: {
        renderTo: 'PMTA4',
        type: 'column'
    },
    title: {
        text: 'PMTA4 - Unitead.info -2012-12-17-2300'
    },
    xAxis: {
        categories: ['beetell.net','wcf.unitead.it','news.camera-factice.com','offres-privees.info','leclubdesacheteurs.com','mieuxchoisir-surinternet.com','nextvibes.com','pnlconsommateurs.com','bonsplans-247.com','nl-gp.com','annuaire-des-deals.com','younitead.com','eurosurveys.com','unit1.viewfr.com','festival-des-promos.com','nl-lg-fr.com','serial-acheteuses.com','obj-mdn.com','incroyableboutique.com','encoreplusdereduc.com','le-club-des-acheteurs.com','boutiquedesprixcasses.com','marketcom.fr','lastardushopping.com','slfrom.com','nl-ddc.com','Blank','itldiff.com','enquetes-consommateurs.com','118-bonsplans.com','ventes-aux-particuliers.fr','pmta.switchcall.com','cmjwcf.com','monshoppingpascher.com','guide-achats-malins.com','lespromos-duweb.com','unclic-undeal.com','chronodeals.fr','1001promo-shop.com','lesbonsplans-dansmaville.com','newsletter-lemondenumerique.com','shopping-et-detente.com','dah.danallan-hypnose.com','telechargesend.com','snpbase.com','nl-sl.com','mgbpwr.com',''],
        labels: {
            rotation: 90,
            align: 'left'
        }
    },
    yAxis: {
        min: 0,
        title: {
            text: '% envoi'
        }
    },
    tooltip: {
        formatter: function() {
            return ''+
            this.series.name +': '+ this.y +' ('+ Math.round(this.percentage) +'%)';
        }
    },
    plotOptions: {
        column: {
            stacking: 'percent'
        }
    },
    series: [{
        name: 'Total mail succesful',
        data: [1247198,392498,312818,333682,186565,231604,332912,199527,209491,288129,100900,234844,230456,128619,122141,69516,61354,79277,66643,66935,68216,41535,35304,11566,92,6252,-720698,2358,3,37,226,296,0,53,4,28,5,0,3,62,0,3,0,1,1,1,1,0]
    }, {
        name: 'Total mail fail',
        data: [123802,725377,272805,195342,273956,189748,81458,175756,97334,18667,187665,48349,42665,72329,0,18269,25185,6857,2629,1852,555,2841,3441,649,8503,879,725377,637,1721,799,551,268,300,173,193,135,131,134,67,2,7,0,2,0,0,0,0,]
    }]
};
var chart = new Highcharts.Chart(options);

      </script>  
   </body>
</html>

Related Tutorials