How to change text color in a voronoiTreemap Legend

Question

Here is an example. Text color is black by default.

library(voronoiTreemap)

data(ExampleGDP)
gdp_json <- vt_export_json(vt_input_from_df(ExampleGDP))
vt_d3(gdp_json, legend=TRUE)

Giagiacamo

The function documentation shows that you can set color_label with a hex color code. Try that. – Baal

@Baal This affects the plot, not the legend (although I do not see it working there either) – Giagiacamo

Same, tried it out and it affected nothing. Sorry – Baal

Answer 1

WOO HOO! I'm pretty happy with myself on this one. I digress.

To set the legend text color change this -> '#b21e29' in the following code:

library(voronoiTreemap)
library(htmlwidgets)
library(dplyr)

data(ExampleGDP)
gdp_json <- vt_export_json(vt_input_from_df(ExampleGDP))

# try number 70032536587832
(plt = vt_d3(gdp_json, legend=TRUE) %>% 
    onRender("function(el){
                legends = el.lastChild.lastChild;
                legends.lastChild.setAttribute('style', 'fill: #b21e29;');
             }"))

Hartzell

If you looked at it before I edited it, I didn't add the libraries initially. I've added them now. – Hartzell

How did you come up with that double lastChild. Could you lead me towards documentation / background on the subject? – Giagiacamo

Several things threw me off course, especially using 'fill' for text. (HTML and CSS use 'color' for text.) What I ended up doing was only coding console.log(el). I went to developer tools -> console and looked at what that collected. It essentially collected how the object is initially created in HTML from JS. I looked for the legend labels. I tried a few different methods (all of which work in HTML, JS, and CSS but didn't necessarily work with htmlwidgets) using the console.log. It modifies 4 elements; htmlwidgets does the forEach. If you want more details, I could mod my answer. – Hartzell