Anilkumar

Thank you working fine now.

Thanks for the great library. But, currently we are facing some color matching issue for msarea chart. Its showing light color instead of full color which we have applied. Even LEGEND showing proper color, But, Graph loading pale (light) color, We want to show full color ( we are giving hex code). I would like to show thick color which actually I have assigned to graph. Even I checked in fiddle sample, There its working fine, But, Why same color not displaying in mobile graph? http://jsfiddle.net/9ckaLzn1/ Can anyone suggest me, Where is the issue here? Here is our code in React native project. theme: 'fusion', showValues: '0', showBorder: '1', borderColor: '#666666', showLegend: '1', interactiveLegend: '1', showCanvasBorder: '1', bgAlpha: '1', canvasBorderAlpha: '1', borderAlpha: '1', bgColor: '#ffffff', showAlternateHGridColor: '0', divLineColor: '#6699cc', divLineAlpha: '60', divLineDashed: '1', divLineDashLen: '1', divLineDashGap: '2', baseFont: 'grey', baseFontSize: '12', baseFontColor: ‘grey’, toolTipBorderColor: 'white', valueFontColor: '#003A69', tooltipborderradius: '1', tooltipborderthickness: '1', labelFontColor: '#B5C3CC', animation: 'true', legendIconSides: '4', legendIconStartAngle: '225', drawCustomLegendIcon: '1', legendItemFontBold: '0', legendItemFont: 'Gotham HTF', legendItemFontSize: '12', legendItemFontColor: '#B5C3CC', legendBorderColor: 'white', legendShadow: '0', numberPrefix: '$', setTransparent: 'true' And Data set is dataset: [{ seriesname: 'Amount', color: '#04249C', data: [{ value: '10', },

I am doing react native application. In that, I am trying to showing bar chart. So, I am using Fusion Chart, It is mandatory to use this library in my application. So, I followed this library installation and it was successful. But, Data is not showing at all. I have added annotations according to get my design. But, No data to display showing in screen even data is there. 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> ); } } Here is the link which I created in stackoverflow query. https://stackoverflow.com/questions/54785081/fusion-chart-showing-no-data-to-display-in-react-native I got stuck due to this issue from 2 days, Can anyone help me to fix this. Its urgent work. Thanks