首页 > 解决方案 > 具有变化的颜色和文本注释的动画量规图

问题描述

我有一个要制作动画的仪表图(按照本教程),图的颜色会根据当前值而变化。我还想要一个注释*,它显示仪表的当前值(我不希望在扇区中显示标准值)。

作为记录,我尝试使用plotly而不是c3::c3_gauge因为我希望最终将其嵌入到plotly::subplot()其他情节中,这些情节将同时动画。

我目前有以下内容:

library(plotly)
library(RColorBrewer)

riskToHex <- function(x) {
  x <- colorRamp(rev(brewer.pal(11, "RdYlBu")))(x / 100)
  rgb <- paste(x[,1], x[,2], x[,3], sep = ",")
  paste0("rgb(", rgb, ")")
}

dd <- data.frame(values = c(90, 60, 20))

dd <- dd %>%
  mutate(colors = riskToHex(dd$values),
         frame = seq.int(nrow(dd)))
dd <- merge(dd, data.frame(values = 200 - dd$values,
                           colors = "white",
                           frame = dd$frame),
            all = TRUE) %>%
  arrange(frame)

plot_ly() %>%
  add_pie(values = dd$values,
          frame = dd$frame,
          rotation = -90,
          marker = list(colors = dd$colors),
          textinfo = "none",
          title = list(text = "Risk score",
                       font = list(size = 20)),
          hoverinfo = "skip",
          sort = FALSE,
          showlegend = FALSE,
          order = "clockwise",
          hole = 0.6) %>%
  add_markers(x = 0,
             y = c(0, 1),
             color = 'rgba(0,0,0,1)') %>%
  add_text(x = 0,
           y = 0.6,
           yshift = 100,
           text = filter(dd, colors != "white")$values,
           frame = distinct(dd, frame)[[1]],
           showlegend = FALSE,
           textfont = list(size = 20)) %>%
  animation_opts(frame = 500) %>%
  layout(
    xaxis = list(showgrid = FALSE,
                 zeroline = FALSE,
                 showticklabels = FALSE
                 ),
    yaxis = list(showgrid = FALSE,
                 zeroline = FALSE,
                 showticklabels = FALSE
    )
  )

这是相当混乱和非常hacky。我不得不使用add_text(),因为我无法弄清楚如何在这种情况下通过更改每个帧中的值(无论是通过add_annotations还是layout(annotations = ...))来获得注释。不幸的是,这add_text()迫使我添加layout禁用轴的块(否则会开始出现)。而且由于饼图似乎打印在纸面上,我还必须添加两个不可见的点,以便我可以实际定位文本(否则轴将始终保持文本居中)。

无论如何,这成功地生成了一个动画图表。但是,颜色似乎只在下一帧更改为正确的值(此时为时已晚)。我不相信这只是处理延迟或其他原因,因为加速动画也会加快颜色变化。

在此处输入图像描述

有趣的是,这只是由于add_text()阻塞而发生的。如果我将其注释掉,则栏上的颜色可以正常工作。

在此处输入图像描述

对此有什么解释和解决方案吗?


*我愿意接受其他解决方案!

标签: ranimationplotlypie-chartr-plotly

解决方案


推荐阅读