Search the Community

Showing results for tags 'reactjs'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Company Forums
    • Company News
  • Product Forums
    • FusionCharts XT
    • FusionWidgets XT
    • PowerCharts XT
    • FusionMaps XT
    • Collabion Charts for SharePoint
    • jQuery Plugin for FusionCharts
    • AngularJS plugin
    • ReactJS plugin
  • General Forums
    • FusionCharts Jobs and Consultation
    • FusionLounge

Found 3 results

  1. Hello, I am a reactjs user. I am trying to render zoomline chart. Even though I see all the values on the console log, the complete chart data is not being displayed. I also see a weird behavior on the X axis. This is more like a timeseries data. Have around 100 data points. the counter seem to be off. If you see the attached image, the category, is not increasing. Appreciate someone chiming in to see that could be wrong. Here is the data { "type": "zoomline", "width": "65%", "height": "400", "renderAt": "chart-container", "dataFormat": "json", "dataSource": { "chart": { "caption": "test", "yaxisname": "Distance", "xaxisname": "time (milliseconds)", "compactdatamode": "1", "linethickness": "1", "dataseparator": "|", "pixelsPerPoint": "40", "theme": "fusion" }, "annotations": { "groups": [] }, "categories": [{ "category": "0|499|1000|1499|1999|2500|3000|3500|4000|4500|4999|5499|5999|6499|6999|7499|7999|8499|8999|9499|10000|10500|11000|11500|12000|12500|13000|13500|14000|14500|15000|15500|16000|16500|17000|17500|18000|18500|19000|19500|19999|20499|20999|21499|21999|22499|22999|23499|23999|24499|24999|25499|25999|26499|0|466|966|1966|2466|2966|3466|3966|4466|4966|5466|5966|6466|6966|7466|7966|8466|8966|9466|9966|10466|10966|11966|12466|17133|17466|17633|17966|18133|18466|18633|18966|19133|19466|19633|19966|20133|20633|21133|21633|22133|22633|23133|23633|24133|24633|27133|27633|28133|28633|29133|30133|30633|31133|31633|32133|32633|33133|33333|33633|33800|34133|34300|34633|34800|35133|35300|35633|35800|36133|36300|36633|36800|37133|37300|37633|37800|38133|38300|38633|38800|39133|39300|39633|41300|41800|42300|43300|43800|44300|44800|45300|45800|46300|46800|47300|47800|48300|48800|51800|0|466|966|1466|1966|2466|2966|3466|3966|4466|4966|4966|5466|5466|5966|6466|6466|6966|6966|7466|7966|8466|8966|9466|9966|10466|10966|11466|11966|11966|12466|12466|12966|13466|13966|14467|14467|14967|14967|15467|15967|16467|16467|16967|16967|17467|17467|17967|17967|18467|18467|18967|19467|19467|19967|19967|20467|20467|20967|21467|21967|22467|22967|23467|23967|24467|24967|25467|25967|26467|26967" }], "dataset": [{ "seriesname": "Left", "data": "0.5104953050613403|0.5109076499938965|0.5218817591667175|0.494259774684906|0.4870876967906952|0.493447870016098|0.49510473012924194|0.5067327618598938|0.517367422580719|0.5186366438865662|0.5171878337860107|0.4655151069164276|0.5110040903091431|0.46559253334999084|0.5015982985496521|0.5015348196029663|0.3967580199241638|0.5114503502845764|0.39506906270980835|0.5128310322761536|0.5142257809638977|0.5248924493789673|0.5255659222602844|0.5362786054611206|0.5069510340690613|0.5050864219665527|0.537865161895752|0.5467922687530518|0.5462315082550049|0.5155147314071655|0.5818623900413513|0.5070918798446655|0.608193039894104|0.6309418678283691|0.6011539101600647|0.5957391262054443|0.48022139072418213|0.593639612197876|0.47338154911994934|0.5983350276947021|0.6040423512458801|0.6128160357475281|0.4814011752605438|0.6145380139350891|0.4829571843147278|0.6153458952903748|0.4776323735713959|0.6103111505508423|0.4926036596298218|0.6161202192306519|0.4838270843029022|0.6209113001823425|0.6152071952819824|0.4821721017360687|0.6169739961624146|0.4722222089767456|0.6243098974227905|0.4786856472492218|0.6177969574928284|0.6248062252998352|0.6271686553955078|0.6264920830726624|0.6279566287994385|0.6172358989715576|0.6274224519729614|0.6282520890235901|0.6243022084236145|0.6310877203941345|0.6262569427490234|0.629167377948761|0.6348291039466858" }, { "seriesname": "Right", "data": "0.5195684432983398|0.5319844484329224|0.5331531763076782|0.5038981437683105|0.4962214529514313|0.50296550989151|0.5045709013938904|0.5149251818656921|0.5239440202713013|0.5236392021179199|0.522319495677948|0.4655810594558716|0.5163400173187256|0.46305936574935913|0.507636308670044|0.5097091794013977|0.39844509959220886|0.5201183557510376|0.3897542357444763|0.5212022662162781|0.5234954357147217|0.533073902130127|0.5230565071105957|0.5358974933624268|0.5047615170478821|0.5030989646911621|0.535716712474823|0.545482873916626|0.5451497435569763|0.5237038731575012|0.5741243958473206|0.5196055173873901|0.6234520077705383|0.638012707233429|0.6052994728088379|0.6007309556007385|0.49467018246650696|0.5996771454811096|0.48378756642341614|0.6049549579620361|0.6112551093101501|0.6206474900245667|0.4835713803768158|0.6224745512008667|0.49296367168426514|0.6245874166488647|0.509536862373352|0.6208853721618652|0.4890725910663605|0.6274436116218567|0.4829174280166626|0.6318084597587585|0.6268883347511292|0.48970893025398254|0.6286619901657104|0.4907556474208832|0.6367518305778503|0.4811948835849762|0.6301906704902649|0.6377986669540405|0.6416488885879517|0.640739917755127|0.6422138810157776|0.6322091221809387|0.643447756767273|0.6439794301986694|0.6391440629959106|0.6463945508003235|0.6420060992240906|0.6457970142364502|0.6519283652305603" }] } }
  2. So I'm using Multi Axis Line Chart with Date range changing option(1 Day, 7 Day, 1 Month, 3 Month, etc..). After creating this chart, whenever I try to change the date range, it gives me this error. What does it mean? Is it something to do with my chart options?
  3. 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