我试图在一个闪亮的 Jmeter 板上制作一个highcharterReact图。该图是基于产品销售,可以在不同的货币。为此,我有一个下拉列表来选择货币,并根据所选的货币改变图。我设法使工具提示货币代码依赖于选择,但是我不知道如何将同样的推理应用于轴值。假设我有以下数据:
df = tibble(id = c(1:10),
item = c(sample(c('item1','item2','item3'), 10, replace = TRUE)),
sales = c(sample(c(500:1500), 10, replace = TRUE)),
units = c(sample(c(1:10), 10, replace = TRUE)),
currency = c(sample(c('GBP','EUR'), 10, replace = TRUE))
)
df = df %>%
group_by(item) %>%
summarise(total_sales = sum(sales),
total_units = sum(units),
currency = currency) %>%
ungroup()
# A tibble: 5 × 4
item currency total_sales total_units
<chr> <chr> <int> <int>
1 item1 EUR 1044 9
2 item1 GBP 5082 25
3 item2 EUR 1071 8
4 item2 GBP 1096 1
5 item3 EUR 2628 25
用户将选择一种货币,绘图将只为该货币生成。我希望在工具提示和Y轴上显示货币值。以下是我为包含工具提示的绘图编写的代码:
df %>%
filter(currency == 'EUR') %>%
mutate(colors = colorize(total_units, scales::viridis_pal(option = "viridis",
begin = 0,
direction = 1)(length(unique(total_units))))) %>%
hchart('column', hcaes(x = item, y = total_sales,
color = colors)) %>%
hc_colorAxis(
min=min(df$total_units),
max=max(df$total_units ),
stops= color_stops(colors = cols),
marker = NULL
) %>%
hc_tooltip(
useHTML = TRUE,
formatter = JS(
"
function(){
outHTML = '<b> Product: </b>' + this.point.item + '<b><br> Sales:</b> '+ this.point.currency + ' ' + this.point.total_sales +
'<b><br> Number of Units Sold: </b>' + this.point.total_units
return(outHTML)
}
"
),
shape = "square", # Options are square, circle and callout
borderWidth = 0 # No border on the tooltip shape
) %>%
hc_yAxis(title = list(text = "Sales Amount",
align = "middle",
margin = 10,
style = list(
fontWeight = "bold",
fontSize = "1.4em"
)
),
labels = list(formatter = JS(
"function(){
data = this.value
return(data)
}"
))
)
如果您随后将过滤器从“EUR”更改为“GBP”,您可以看到工具提示自动更新:
我希望在y轴上显示相同的动态前缀,以便在选择'GBP'时自动获得此结果,对于'EUR'则相反:
有什么建议吗?
1条答案
按热度按时间k2fxgqgv1#
在
chart.events.load
中,可以使用update方法来更改后缀。演示:https://jsfiddle.net/BlackLabel/b0yucdot/1/
API:https://api.highcharts.com/class-reference/Highcharts.Axis#update