setChartData json file react

[bondi15]

Hi , I have the code of setChartData from json file in javascript ( http://jsfiddle.net/fusioncharts/r4jjewey/) but my charts are in react and would like the same results with that language.

sorry i am beginner whit react .

My react Code :

import React, { Component, Fragment } from "react"; 

import ReactDOM from 'react-dom';

import FusionCharts from "fusioncharts";

import charts from "fusioncharts/fusioncharts.charts";

import ReactFusioncharts from "react-fusioncharts";

import Students from "./Students.json";

import Pie3d from "./Pie3d.json";

import Pie3d2 from "./Pie3d2.json";

 

// Resolves charts dependancy

charts(FusionCharts);

 

 

class Pie extends React.Component {

 

  render() {  

    return (

 

      <ReactFusioncharts

        type="pie3d"

        width="50%"

        height="50%"

        dataFormat="JSON"

        dataSource={Pie3d}

      />

      

);

          }

}

 

export default Pie;

My javascript code for setChartData (working with my json data) :

FusionCharts.ready(function () {

 

  var PieData = new FusionCharts({

    type: 'pie3d',

    renderAt: 'chart-container',

    width: '50%',

    height: '50%',

    dataFormat: 'json',

    dataSource: Pie3d

}).render();

function setData() {

  var year_data = document.getElementById("year").value;

  console.log(year_data);

  if (year_data == "2013") {  

      PieData.setChartData(Pie3d, "json");

  } 

  

  else if (year_data == "2014") {

    PieData.setChartData(Pie3d2, "json");

  }

 

}

 

document.getElementById("set_chart_data").addEventListener("click", setData);

 

});

 

Thanks for any help.

[Ayan Bhadury]

To use API methods in React env please refer to this guide  : https://github.com/fusioncharts/react-fusioncharts-component#working-with-apis