Performance of AmCharts

[datastorm-open]

Performance of AmCharts

[bthieurmel]

Hi,
Can you first send us some code ?

[debsush]

I will give this a try.

Let us use some large data sets

http://ichart.yahoo.com/table.csv?s=GOOG&a=0&b=1&c=2000&d=0&e=31&f=2015&g=d&ignore=.csv

Now we try and plot a stockChart out of it.. Say it takes us 3-4 seconds to pull the data and extract the chart. Now if we parameterize the StockGraphType using a radio button. Now every time the radio button is changed, the entire plot is built from scratch once again because of the reactive nature of render function and hence takes ~3-4 seconds each time the radio button option is changed.

Now when you compare this with the below Javascript version of the example, ValiDateNow() is triggered which only changes the chart type instead of building the entire chart from scratch and hence boosts the performance.

JS Fiddle: http://jsfiddle.net/amcharts/32usT/

Shiny Code:

ui.R

shinyUI(fluidPage(

useShinyjs(),

fluidRow(
column(12,radioButtons("fcharttype4", label =NULL, choices = c("candlestick"="candlestick",
"ohlc"="ohlc",
"line" = "line"),
selected = "line",inline = TRUE, width = NULL)),
column(12,amChartsOutput("fspanel4a",height="100%"))
)
))

server.R

server = function(input, output, session) {

Prepare the Data - This is the data from the URL

datagoog<-fmydata4[,c("Date","Close","Volume")]
datagoog$Date = format(as.Date(datagoog$Date),"%Y-%m-%d")

Render the Chart

output$fspanel4a <- renderAmCharts({

K1<-pipeR::pipeline(
  amStockChart(startDuration = 0, 
               theme = "light"),
  addDataSet(dataSet(title = "Main", 
                     categoryField = "Date",
                     compared=TRUE,
                     dataProvider = data.table(datagoog)) %>>%
               addFieldMapping(fromField = "Close", 
                               toField = "Close") %>>%
               addFieldMapping(fromField = "Volume", 
                               toField = "Volume")),      
  addPanel(stockPanel(showCategoryAxis = FALSE, title = 'Price', percentHeight = 70) %>>%
             addStockGraph(id = 'g1', 
                           valueField = "Close", 
                           type=input$fcharttype4,
                           comparable = TRUE,
                           balloonText = '[[title]] =<b>[[value]]</b>',
                           compareGraphBalloonText = '[[title]] =<b>[[value]]</b>') %>>%
             setStockLegend(periodValueTextComparing = '[[percents.value.close]]%',
                            periodValueTextRegular = '[[value.close]]') %>>%
             addListener('zoomed', 'function(event) {alert("zoomed")}')),
  addPanel(stockPanel(title = 'Volume', 
                      percentHeight = 30) %>>%
             addStockGraph(valueField = "Volume", 
                           type = "column", 
                           fillAlphas = 1) %>>%
             setStockLegend(periodValueTextRegular = '[[value.close]]')),
  setChartScrollbarSettings(graph = 'g1'),
  setChartCursorSettings(valueBalloonsEnabled = TRUE, 
                         fullWidth = TRUE,
                         cursorAlpha = 0.1, 
                         valueLineBalloonEnabled = TRUE,
                         valueLineEnabled = TRUE, 
                         valueLineAlpha = 0.5),
  setPeriodSelector(periodSelector(position = 'left') %>>%
                      addPeriod(period = 'DD', selected = TRUE, count = 7, label = '1 week') %>>%
                      addPeriod(period = 'MAX', label = 'MAX') %>>%
                      addListener('changed', 'function(event) {alert("changed")}')),
  setDataSetSelector(dataSetSelector(position = 'left') %>>%
                       addListener('dataSetCompared', 'function(event) {alert("dataSetCompared")}')),
  setPanelsSettings(recalculateToPercents = FALSE)
)


})  

}

So the question is how can we intelligently change parameters within the AmStockChart without having to rebuild it every time

[debsush]

The latest version of amCharts renders at a very high speed so closing the issue