Диаграмма слияния, показывающая Нет данных для отображения в React Native

Question

Я делаю реагировать нативное приложение.В этом я пытаюсь показать гистограмму.Итак, я использую Fusion Chart, обязательно использовать эту библиотеку в моем приложении.Итак, я последовал за этой установкой библиотеки, и она прошла успешно.Но данные вообще не отображаются.

Нет данных для отображения на экране.

Мой код

export default class App extends Component {
  constructor(props) {
    super(props);

    this.state = {
      type: 'bar2d',
      width: '100%',
      height: '100%',
      dataFormat: 'json',
      dataSource: {
        chart: {
            captionFontSize: '16',
            subcaptionFontSize: '14',
            showAlternatevGridColor: '0',
            numDivLines: '0',
            valueFontColor: '#ffffff',
            yAxisMinValue: '0',
            yAxisMaxValue: '100',
            showYAxisValues: '0',
            // "canvasBorderColor" : "#b3ffb3",
            canvasBgColor: '#ffffff,#e6eeff',
            canvasTopMargin: '100',
            paletteColors: '#990000',
            usePlotGradientColor: '1',
            plotGradientColor: '#ff8080',
            divLineAlpha: '0',
            plotSpacePercent: '60',
            useDataPlotColorForLabels: '1',
            showPercentInTooltip: '0',
            showLegend: '1',
            showLabels: '0',
            showValues: '0',
            placeValuesInside: '1',
            showBorder: '0'
          },
          data: [
            {
              label: 'Travel & Leisure',
              value: '41'
            },
            {
              label: 'Advertising/Marketing/PR',
              value: '39'
            },
            {
              label: 'Other',
              value: '38'
            },
            {
              label: 'Real Estate',
              value: '32'
            },
          ],
          annotations: {
            showBelow: '0',
            autoScale: '1',
            groups: [{
              id: 'user-images',
              items: [{
                id: 'dyn-label-bg',
                color: '#000000',
                align: 'left',
                type: 'text',
                text: 'Best when calm',
                x: '$canvasStartX+0',
                y: '$dataset.0.set.0.ENDY-0'
              }, {
                id: 'dyn-label-bg',
                color: '#000000',
                align: 'left',
                type: 'text',
                text: 'Very Relaxed',
                x: '$canvasStartX+00',
                y: '$dataset.0.set.1.ENDY-0'
              }, {
                id: 'dyn-label-bg',
                color: '#000000',
                align: 'left',
                type: 'text',
                text: 'Mellow',
                x: '$canvasStartX+00',
                y: '$dataset.0.set.2.ENDY-0'
              }, {
                id: 'dyn-label-bg',
                color: '#000000',
                align: 'left',
                type: 'text',
                text: 'Out of Control',
                x: '$canvasStartX+00',
                y: '$dataset.0.set.3.ENDY-0'
              }]
            }]
          }
    }

    };

    this.libraryPath = Platform.select({
      // Specify fusioncharts.html file location
      ios: require('./assets/fusioncharts.html'),
      //android: { uri: 'file:///android_asset/fusioncharts.html' },
    });
  }

  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.heading}>
          FusionCharts Integration with React Native
        </Text>
        <View style={styles.chartContainer}>
          <FusionCharts
            type={this.state.type}
            width={this.state.width}
            height={this.state.height}
            dataFormat={this.state.dataFormat}
            dataSource={this.state.dataSource}
            libraryPath={this.libraryPath} // set the libraryPath property
          />
        </View>
      </View>
    );
  }
}

Я настроилэто для дизайна.Может кто-нибудь сказать мне, где я делаю не так?