
LMUJICAF
Members-
Content count
2 -
Joined
-
Last visited
About LMUJICAF
-
Rank
Forum Newbie
-
Hello, I resolved it importing import charts from "fusioncharts/fusioncharts.widgets"; instead of import charts from "fusioncharts/fusioncharts.charts";
- 3 replies
-
- react
- fusioncharts widgets
-
(and 1 more)
Tagged with:
-
LMUJICAF started following Cylinder Chart demo in React
-
Hello I'm having issues when trying to draw a cylinder in react. I have my cylinder as a component and the I import in one of my views. mport React from "react"; import FusionCharts from "fusioncharts"; import charts from "fusioncharts/fusioncharts.charts"; import ReactFusioncharts from "react-fusioncharts"; // Resolves charts dependancy charts(FusionCharts); // Resolves charts dependancy //charts(FusionCharts); const dataSource = { chart: { caption: "LPG Level Indicator", lowerlimit: "0", upperlimit: "25", lowerlimitdisplay: "Empty", upperlimitdisplay: "Full", numbersuffix: " ltrs", cylfillcolor: "#5D62B5", plottooltext: "LPG Consumption: <b>20 ltrs</b>", cylfillhoveralpha: "85", theme: "fusion" }, value: "20" }; class Cylinder extends React.Component { render() { return ( <ReactFusioncharts type="cylinder" width="100%" height="100%" dataFormat="JSON" dataSource={dataSource} /> ); } } export default Cylinder; Then I call it like this in my view: import React from "react"; import Cylinder from "../components/cylinder.js"; // core components class Monitoring extends React.Component { render() { return ( <Cylinder value = "20"/> ) } } Below the result:
- 3 replies
-
- react
- fusioncharts widgets
-
(and 1 more)
Tagged with: