之前FusionCharts版本只是使用js（jquery）版本，随着前端框架不断出现新的，FusionCharts也在不断改进，兼容不同的新框架，其中有vue.js和React。下面利用实例说明如何在React使用FusionCharts并获取图形点击的label值和value值，操作如下：
工具/原料
1
FusionCharts
2
React
3
JavaScript
4
HTML5
5
CSS3
6
HBuilderX
7
浏览器
8
截图工具
方法/步骤
1
第一步，下载React框架代码，然后在App.js文件中导入react-fusioncharts、fusioncharts以及fusioncharts的主题，如下图所示：
2
第二步，定义图形的数据源dataSource，包含了标题属性、数据label和Value，如下图所示：
3
第三步，定义一个类Column2DChart，并创建一个点击函数事件，如下图所示：
4
第四步，调用FusionCharts中的addEventListener监听事件，并调用render()方法，如下图所示：
5
第五步，在App.js文件中，函数App中引入定义的组件Column2D，需要导入这个js文件，如下图所示：
6
第六步，保存代码并使用命令运行React项目，然后打开浏览器查看图形效果，如下图所示：
注意事项
1
注意在React中使用FusionCharts组件，并获取图形的label和value
2
注意在Vue.js中使用FusionCharts和React使用FusionCharts的区别
上一篇：片多多怎么关闭流量自动播放功能
下一篇：小鸡词典怎样开启链接智能跳转