Short and sweet: Rewriting a highchart function in R.
I figured out how to write a function in highcharts to rank my values and categories in a heatmap. So that the category with the highest number will display on top and vice versa. This is represented in a year column that that has a different ranking of each year. Issue is that the code is done in the highcharts container in javascropt and I want to recreate this piece of code in a R-markdown file but can't manage to figure out how to wrap the function that ranks the values and catagories as my highchart code does. Specifically this function:
const processedData = [];
columnsData.forEach(column => {
column.data.sort((a, b) => a.value - b.value);
column.data.forEach((dataEl, index) => {
processedData.push({
name: column.year,
y: index,
value: dataEl.value,
dataLabels: {
format: dataEl.name + ': ' + dataEl.value
}
});
});
});
Any help with wrapping the function to highcharter would be great.
const columnsData = [{
year: '2001',
data: [{
name: 'A',
value: 55
}, {
name: 'B',
value: 45
}, {
name: 'C',
value: 67
}]
}, {
year: '2002',
data: [{
name: 'D',
value: 15
}, {
name: 'E',
value: 24
}, {
name: 'F',
value: 67
}]
}, {
year: '2003',
data: [{
name: 'G',
value: 77
}, {
name: 'H',
value: 56
}, {
name: 'I',
value: 58
}]
}];
const processedData = [];
columnsData.forEach(column => {
column.data.sort((a, b) => a.value - b.value);
column.data.forEach((dataEl, index) => {
processedData.push({
name: column.year,
y: index,
value: dataEl.value,
dataLabels: {
format: dataEl.name + ': ' + dataEl.value
}
});
});
});
console.log(processedData)
Highcharts.chart('container', {
chart: {
type: 'heatmap',
marginTop: 40,
marginBottom: 80,
plotBorderWidth: 1
},
xAxis: {
type: 'category'
},
yAxis: {
visible: false
},
colorAxis: {
min: 0,
minColor: '#FFFFFF',
maxColor: Highcharts.getOptions().colors[0]
},
legend: {
align: 'right',
layout: 'vertical',
margin: 0,
verticalAlign: 'top',
y: 25,
symbolHeight: 280
},
series: [{
name: 'Sales per employee',
borderWidth: 1,
data: processedData,
dataLabels: {
enabled: true,
color: '#000000'
}
}]
});
Highcharter (RMD):
spx_highchart %>%
hchart(type = "heatmap",
hcaes(
x = year,
y = class,
value = returns,
color = colour,
borderWidth = 1
)
JS Fiddle: https://jsfiddle.net/6y45fdjt/