Jump to content
JChartFX Community

angelr

Administrators
  • Posts

    29
  • Joined

  • Last visited

Community Answers

  1. angelr's post in Slowness when rendering multiple charts was marked as the answer   
    We ran a few tests at our end, trying to replicate the behavior you reported, and this is what we found:
     
    We used 3 different tests on 3 different browsers:
    Test 1: An HTML webpage rendering (12) basic charts with some minor customization like series gallery types. Test 2: An HTML webpage rendering (12) charts with some data being passed to the charts. Test 3: An HTML webpage rendering (12) charts with custom visual attributes, like enabling animations, adding titles, changing labels, modifying the series fill mode and also passing data to the chart. and these are the results we got:
     
     
    Using a Timer
     
    Browser Basic +Data +Visual Attributes Firefox 1.75s 1.90s 6.10s Chrome 1.65s 2.30s 3.61s IE 1.58s 1.83s 4.23s  
    Using the browser Profiler with Cache
     
    Browser Basic +Data +Visual Attributes Firefox 0.08s 0.08s 0.10s Chrome 2.01s 1.91s 3.60  
    Using the browser Profiler without Cache
     
    Browser Basic +Data +Visual Attributes Firefox 5.09s 4.06s 11.3s Chrome 2.26s 2.30s 2.21s Test 1 - Basic.
    chart1.getData().setSeries(5);    chart1.getSeries().getItem(0).setGallery(cfx.Gallery.Bar); chart1.getSeries().getItem(1).setGallery(cfx.Gallery.Bar); chart1.getSeries().getItem(2).setGallery(cfx.Gallery.Lines); chart1.getSeries().getItem(2).setStacked(false); chart1.getSeries().getItem(3).setGallery(cfx.Gallery.Lines); chart1.getSeries().getItem(3).setStacked(false);  
    Test  2 - Passing Data
    chart1.getData().setSeries(5);    chart1.getSeries().getItem(0).setGallery(cfx.Gallery.Bar); chart1.getSeries().getItem(1).setGallery(cfx.Gallery.Bar); chart1.getSeries().getItem(2).setGallery(cfx.Gallery.Lines); chart1.getSeries().getItem(2).setStacked(false); chart1.getSeries().getItem(3).setGallery(cfx.Gallery.Lines); chart1.getSeries().getItem(3).setStacked(false); for (var i = 0; i < 10; i++) {         chart1.getData().setItem(0, i, Math.floor(Math.random() * (100)));         chart1.getData().setItem(1, i, Math.floor(Math.random() * (100)));         chart1.getData().setItem(2, i, Math.floor(Math.random() * (100)));         chart1.getData().setItem(3, i, Math.floor(Math.random() * (100)));    }  
     
    Test 3 - Visual Attributes + Passing Data
    chart1.getData().setSeries(5);    chart1.getSeries().getItem(0).setGallery(cfx.Gallery.Bar); chart1.getSeries().getItem(1).setGallery(cfx.Gallery.Bar); chart1.getSeries().getItem(2).setGallery(cfx.Gallery.Lines); chart1.getSeries().getItem(2).setStacked(false); chart1.getSeries().getItem(3).setGallery(cfx.Gallery.Lines); chart1.getSeries().getItem(3).setStacked(false); chart1.getAnimations().getLoad().setEnabled(true);// # animates drawing of graph var titles = chart1.getTitles(); var title = new cfx.TitleDockable(); title.setText("Expected vs Worked/Flexed Hours"); titles.add(title); chart1.getLegendBox().setDock(cfx.DockArea.Bottom);   chart1.getAxisX().setStep(2); chart1.getAxisX().setLabelAngle(45);  chart1.getAxisY().getTitle().setText("Hours");  chart1.getAllSeries().setBarShape(cfx.BarShape.Cylinder); chart1.getAllSeries().setStackedStyle(cfx.Stacked.Normal); chart1.getAllSeries().setFillMode(cfx.FillMode.Pattern); chart1.getAllSeries().setVolume(75); chart1.getAllSeries().setStackedStyle(cfx.Stacked.Normal); for (var i = 0; i < 10; i++) {         chart1.getData().setItem(0, i, Math.floor(Math.random() * (100)));         chart1.getData().setItem(1, i, Math.floor(Math.random() * (100)));         chart1.getData().setItem(2, i, Math.floor(Math.random() * (100)));         chart1.getData().setItem(3, i, Math.floor(Math.random() * (100)));     }  
     
    As you can see there are different variables that might affect the chart rendering times like: the amount and location of the data being passed to the chart, the customized chart visual attributes, whether the page is cached or not, the browser type and version rendering the chart, location of jChartFX (plus other frameworks) libraries, among many others.
     
    Attached you'll find the code and the screenshots of the samples we used for our tests, so you can use them as a base to troubleshoot the slowness issue you are reporting.



    TestCharts - Basic.zip
    TestCharts - Data.zip
    TestCharts - VisualAttributes.zip
×
×
  • Create New...