Friday, March 25, 2016

highchart sample



    var myData = [
      {
        name: "Book",
        y: 0      }, {
        name: "Chapters",
        y: 1      }, {
        name: "Conferences",
        y: 21      },
      {
        name: "journal articles",
        y: 19      }, {
        name: "presentations",
        y: 24      },
      {
        name: "softwares",
        y: 0      },
      {
        name: "technical reports",
        y: 0      },
      {
        name: "Unpublished works",
        y: 7      }

    ];

    var mySeries = [];

    function parseData(inData) {
      var outData = [];
      var jsonData = {};
      jsonData["name"] = "books";
      jsonData["y"] = inData['books'].length;
      outData.push(jsonData);
      jsonData = {};
      jsonData["name"] = "chapters";
      jsonData["y"] = inData['chapters'].length;
      outData.push(jsonData);
      jsonData = {};
      jsonData["name"] = "journal_articles";
      jsonData["y"] = inData['journal_articles'].length;
      outData.push(jsonData);
      return outData;
    }

    mySeries = parseData(datafromBus);
    console.log("MyData");
    console.log(myData);
    console.log("MySeries");
    console.log(mySeries);
    function onGeneratedRow(inData) {
      var outData = [];

      inData.forEach(function (row) {
        var jsonData = {};
        jsonData["name"] = row.name;
        jsonData["y"] = row.y;
        outData.push(jsonData);
      });
      return outData;
    }

    //mySeries = onGeneratedRow(myData);

    //for (var i = 0; i < myData.length; i++) {    //    mySeries.push(myData[i].name, parseInt( myData[i].y));    //    //}
    var options = {
      chart: {
        plotBackgroundColor: null,
        plotBorderWidth: null,
        plotShadow: false,
        type: 'pie'      },
      title: {
        text: 'Activity'      },
      credits: {
        enabled: false      },
      tooltip: {
        pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'      },
      plotOptions: {
        pie: {
          allowPointSelect: true,
          cursor: 'pointer',
          dataLabels: {
            enabled: true,
            format: '<b>{point.name}</b>: {point.percentage:.1f} %',
            //                  format: '<b>{point.name}</b>',            style: {
              color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'            }
          }
        }
      },
      series: [{
        name: "Activity",
        colorByPoint: true,
        //data: myData        data: mySeries      }]
    };

    //$scope.chart.series[0].setData(mySeries);
    $scope.chart = chart.highcharts(options);
  }

};

No comments:

Post a Comment