I'm using R (RStudio) to make a graphic using Shiny and rCharts, the highcharts library.
I want to make a bar chart and put an image in the labels of the X axis instead of a string.
What I want in the final code of the graphic is, in the HighCharts script:
"xAxis": [
{
"categories": [ "5130511401", "5615515659", "5615515800", "5684956800", "5699931555", "5699931628", "6428829420", "6627947800", "6722601505", "6728603600" ],
"labels": {
"useHTML": true,
"formatter": function() {
if(this.value == 5130511401)
return '<img src= "http://5130511401.jpg" style = " width: 30px; vertical-align : middle" />';
else if(this.value == 5615515659)
return '<img src= "http://5130511401.jpg" style = " width: 30px; vertical-align : middle" />';
else if(this.value == 5615515659)
return '<img src= "http://5130511401.jpg" style = " width: 30px; vertical-align : middle" />';
else if(this.value == 5615515659)
return '<img src= "http://5130511401.jpg" style = " width: 30px; vertical-align : middle" />';
else
return '<img src= "http://5130511401.jpg" style = " width: 30px; vertical-align : middle" />';
}
}
}
],
"id": "chart7a5c46f2dc2b"
});
The code I write in R, using rCharts is:
h <- Highcharts$new()
h$chart(type = "bar")
h$title(text = "Top 10 products")
h$series(data = as.numeric(data_plot$amount), name = 'Desktop')
h$xAxis(categories = unique(data_plot$product),
labels = list( useHTML = TRUE,
formatter = paste("#! function() {",
"if(this.value == ", data_plot$product[1], ")",
"return '<img src= \"", data_plot$img_url[1], "\" style = \" width: 30px; vertical-align : middle\" />';",
"if(this.value == ", data_plot$product[2], ")",
"return '<img src= \"", data_plot$img_url[2], "\" style = \" width: 30px; vertical-align : middle\" />';"
"if(this.value == ", data_plot$product[3], ")",
"return '<img src= \"", data_plot$img_url[3], "\" style = \" width: 30px; vertical-align : middle\" />';"
"if(this.value == ", data_plot$product[4], ")",
"return '<img src= \"", data_plot$img_url[4], "\" style = \" width: 30px; vertical-align : middle\" />';"
"if(this.value == ", data_plot$product[5], ")",
"return '<img src= \"", data_plot$img_url[5], "\" style = \" width: 30px; vertical-align : middle\" />';"
"}", sep = ""
)
)
)
The problem is that paste generates the double quotes with the escape character ("\") and I can not get the code to generate well.
[1] "#! function() {if(this.value == 5130511401)return '<img src= \"http://static.massimodutti.net/3/photos//2016/I/0/1/p/5130/511/401/5130511401_1_1_17.jpg?t=1476783403594\" style = \" width: 30px; vertical-align : middle\" />';if(this.value == 5615515659)return '<img src= \"http://static.massimodutti.net/3/photos//2016/I/0/1/p/5615/515/659/5615515659_1_1_17.jpg?t=1476720782060\" style = \" width: 30px; vertical-align : middle\" />';if(this.value == 5615515800)return '<img src= \"http://static.massimodutti.net/3/photos//2016/I/0/1/p/5615/515/800/5615515800_1_1_17.jpg?t=1476720782060\" style = \" width: 30px; vertical-align : middle\" />';if(this.value == 5684956800)return '<img src= \"http://static.massimodutti.net/3/photos//2016/I/0/1/p/5684/956/800/5684956800_1_1_17.jpg?t=1475863265998\" style = \" width: 30px; vertical-align : middle\" />';if(this.value == 5699931555)return '<img src= \"http://static.massimodutti.net/3/photos//2016/I/0/1/p/5699/931/555/5699931555_2_1_17.jpg?t=1476203883032\" style = \" width: 30px; vertical-align : middle\" />';}"
The question is whether I can generate a string of characters with paste or with any other function, so that I can pass the correct argument to the formatter without the escape characters coming out.
Thank you very much!