Recommended Posts

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, { ComponentFragment } 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.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now