【问题标题】:Change hcharts( ) bars from solid-colored to gradient将 hcharts( ) 条形从纯色更改为渐变
【发布时间】:2019-07-02 23:42:54
【问题描述】:

我试图让我的highcharter 图(用于 R Shiny 仪表板)更漂亮,方法是使颜色在两种绿色之间形成渐变。我使用highcharter 中的默认pokemon 数据集制作了以下基本示例。

library(shiny)
library(highcharter)

#Subset the data into the pokemon that are Grass and Poison
grass_subset <- subset(pokemon, type_1 == "grass" & type_2 == "poison")

#Define the chart parameters
grass_poison_chart <- hchart(grass_subset, type = "column", hcaes(x=pokemon, y=base_experience))

#Define theme elements
myTheme <- hc_theme(
  colors = c('#658D1B', '84BD00', 'white'),
  chart = list(
    backgroundColor = "white"    
  ))

#Apply theme to grass_poison_chart
grass_poison_chart %>% hc_add_theme(myTheme)

产量

问题是我不知道如何用渐变来着色条。我尝试将myTheme 的定义更改为以下内容:

 myTheme <- hc_theme(
   color = list(
     linearGradient = (0,0,0,1),
     stops = (0, '#658D1B'),(1, '#84BD00')
   )
  )

天真地尝试简单地复制highcharts 语法:

color: {
    linearGradient: { x1: 0, x2: 0, y1: 0, y2: 1 },
    stops: [
        [0, '#658D1B'],
        [1, '#84BD00']
    ]
}

并将其更改为括号,但我真的不知道从哪里开始。我知道我所做的可能行不通(实际上也行不通),但是在highcharter 中是否可能发生这样的事情?我错过了什么?

【问题讨论】:

    标签: r highcharts shiny shinydashboard


    【解决方案1】:

    抱歉回复晚了,我在安装 R 时遇到了一些问题。

    我做的第一件事是尝试用纯 JS 编写代码。这部分很简单:https://jsfiddle.net/BlackLabel/byht9jd6

    我认为在 R 中实现它有点困难,但是.. 这部分也很容易 :) 这是一个代码:

    library(shiny)
    library(highcharter)
    
    #Subset the data into the pokemon that are Grass and Poison
    grass_subset <- subset(pokemon, type_1 == "grass" & type_2 == "poison")
    
    #Define the chart parameters
    grass_poison_chart <- hchart(grass_subset, type = "column", hcaes(x=pokemon, 
    y=base_experience)) %>%
      hc_plotOptions(
        column = list(
          color = list(
            linearGradient = list(x1 = 0, x2 = 0, y1 = 0, y2 = 1),
            stops = list(
              c(0, '#658D1B'),
              c(1, '#84BD00')
            )
          )
        )
      )
    
    #Apply theme to grass_poison_chart
    grass_poison_chart %>% hc_add_theme(myTheme)
    

    【讨论】:

    • 这很完美!我能够很容易地将它适应我的代码。老实说,我不知道可以简单地将代码从 highcharts 转换为 highcharter。显然我做错了什么!
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2010-10-05
    • 1970-01-01
    • 1970-01-01
    • 2013-07-29
    • 1970-01-01
    • 2019-11-30
    • 2020-09-11
    相关资源
    最近更新 更多