NA Values being assigned a color

[jkaupp]

I dug around trying to find a documented solution for this, and I think it may be related to issue #14. When supplying a data frame column for category values, NA/Blank/NULL values get mapped to a colour, when I would expect them to be blank.

Below is a reproducible example, and as shown int the screenshot all elements of indicator B are NA, and should be blank, but get assigned a value.

df<-data.frame( course=c("PSYC100","PSYC102","PSYC103","PSYC100","PSCY103","PSYC100","PSYC100"), indicator=c("A","B","C","C","A","B","C"), level=c("I",NA,"I","D","A",NA,"I"))

dimple( x = "course", y = "indicator", groups = "level", data = df, type = "bar" ) %>% yAxis(type = "addCategoryAxis") %>% xAxis(type = "addCategoryAxis") %>% add_legend()

[timelyportfolio]

mmmm, this is interesting. I think I see the issue. You want B to show up on the y axis, but you don't want to see the rectangles. If you remove the NA, you lose B on the axis. Unfortunately, I don't know the best way to attack this in a clean way. I can show a hack how to remove the rectangles after the charts are drawn, but I'm not crazy about this method even though it does work.

library(rcdimple)

df<-data.frame(
  course=c("PSYC100","PSYC102","PSYC103","PSYC100","PSCY103","PSYC100","PSYC100"),
  indicator=c("A","B","C","C","A","B","C"),
  level=c("I",NA,"I","D","A",NA,"I"),
  stringsAsFactors = FALSE
)

dp <- dimple(
  x = "course",
  y = "indicator",
  groups = "level",
  data = df,
  type = "bar"
) %>%
  yAxis(type = "addCategoryAxis") %>%
  xAxis(type = "addCategoryAxis") %>%
  add_legend()

# leave the rects but make them invisible
dp$x$options$tasks <- list(
  htmlwidgets::JS(
'function(){
  d3.selectAll(
    d3.select(this).selectAll("rect")[0]
      .filter(function(d){
        return d3.select(d).datum().aggField[0] === null }
      )
  ).style("fill","none")
   .style("stroke","none");
}'
  )
)

# remove the rects
dp$x$options$tasks <- list(
  htmlwidgets::JS(
'function(){
  d3.selectAll(
    d3.select(this).selectAll("rect")[0]
      .filter(function(d){
        return d3.select(d).datum().aggField[0] === null }
      )
  ).remove()
}'
  )
)