繁体   English   中英

如何在以下 dygraph 上显示所有月份(轴刻度/中断)? (右)

[英]How to display all the months (axis ticks/breaks) on the following dygraph? (R)

按照提供的 R 代码和数据,使用 dygraph 库(js dygraph 的 R 接口)

library(xts)
library(htmlwidgets)
library(dygraphs)

date <- c("2015-01-01", "2015-02-01", "2015-03-01", "2015-04-01", "2015-05-01", "2015-06-01", "2015-07-01", "2015-08-01", "2015-09-01", "2015-10-01","2015-11-01", "2015-12-01")

revenue <- c(81920, 75240, 70840, 66560, 72140, 71160, 73880, 73900, 69160, 75940, 76100, 76020)

rate <- c(5.10, 5.15, 4.41, 4.33, 4.39, 4.62, 4.58, 4.67, 4.40, 4.85, 4.83, 4.76)

data <- data.frame(date, revenue, rate)
data$date <- as.Date(data$date, format="%Y-%m-%d")

#convert data to xts object
data <- xts(x=data, order.by = data$date)

getMonth <- 'function(d){
               var monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun","Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
               return monthNames[d.getMonth()];
               }'

customTicker <- 'function(min, max, pixels, opts) {
            return Dygraph.getDateAxis(min, max, Dygraph.Granularity.MONTHLY, opts, this);
          }'

dygraph(data, main = "Revenue & Rate") %>%
  dyAxis("x", rangePad = 40, drawGrid = FALSE, axisLabelFormatter=JS(getMonth)) %>%
  dyAxis("y", label = "Revenue", valueRange = c(0, 100000), independentTicks = TRUE)%>%
  dyAxis("y2", label = "Rate ", valueRange = c(0, 10), independentTicks = TRUE) %>%
  dyBarSeries('revenue', label="revenue",color = "#0099F9") %>% 
  dySeries('rcrate', label="rate",color = "#15354A", axis=('y2'), strokeWidth=4, pointSize=3, drawPoints=TRUE)

输出

如何让所有月份显示在日期轴上,而不是仅显示几个(在最大绘图大小下,所有月份都会出现。我希望所有月份总是出现,而与绘图大小无关)。

dyAxis("x" ...)中的ticker=JS(customTicker)参数似乎不起作用。 Probs 与 Dygraph.getDateAxis ...(我没有正确引用当前的 dygraph 对象?)

另一位用户使用 js 版本询问这个问题, 如何使用 dygraphs 显示所有月份?

这是小提琴: https ://jsfiddle.net/wvsj8toc/3/

更新:

根据文档,ticker 参数采用 (value, label) 对的数组。 我尝试运行 2015-01-01 - 2015-12-01 的小提琴并使用 console.log 获得以下数组(用于股票代码的返回值)。 我将此值用于 dyAxis 中的ticker 参数,它可以工作。

[{ v: 1420059600000, label: "Jan"}, { v: 1422738000000, label: "Feb"}, { v: 1425157200000, label: "Mar"}, { v: 1427835600000, label: "Apr"}, { v: 1430427600000, label: "May"}, { v: 1433106000000, label: "Jun"}, { v: 1435698000000, label: "Jul"}, { v: 1438376400000, label: "Aug"}, { v: 1441054800000,标签:“Sep”},{ v:1443646800000,标签:“Oct”},{ v:1446325200000,标签:“Nov”},{ v:1448917200000,标签:“Dec”}];

customTicker <- 'function(a, b, pixels, opts) {
return [{    v: 1420059600000, label: "Jan"}, {    v: 1422738000000, label: "Feb"}, {    v: 1425157200000, label: "Mar"}, {    v: 1427835600000, label: "Apr"}, {    v: 1430427600000, label: "May"}, {    v: 1433106000000, label: "Jun"}, {    v: 1435698000000, label: "Jul"}, {    v: 1438376400000, label: "Aug"}, {    v: 1441054800000, label: "Sep"}, {    v: 1443646800000, label: "Oct"}, {    v: 1446325200000, label: "Nov"}, {    v: 1448917200000, label: "Dec"}];}
'
  
dygraph(data, main = "Revenue & Rate") %>%
  dyAxis("x", rangePad = 40, drawGrid = FALSE, ticker= JS(customTicker), axisLabelFormatter=JS(getMonth)) %>%
 

我如何生成这个数组呢?

参考:

https://dygraphs.com/options.html#ticker https://www.rdocumentation.org/packages/dygraphs/versions/1.1.1.6/topics/dyAxis

假设您有一个日期向量(就像您在问题中所做的那样),您可以像这样创建名称-值配对数组。 请记住,Javascript 对日期有点棘手! 所以一个小小的改变就可以让它分崩离析。

如果您有任何问题,请告诉我。

ticker = "function(a, b) {
          cDts = ['2015-01-01', '2015-02-01', '2015-03-01', '2015-04-01', 
                  '2015-05-01', '2015-06-01', '2015-07-01', '2015-08-01',
                  '2015-09-01', '2015-10-01','2015-11-01', '2015-12-01'];
          x = [];
          for(i = 0; i < cDts.length; i++) {
            d = Date.parse(cDts[i]);
            e = new Date(cDts[i]);
            e.setDate(e.getDate() + 1); /*assuming you're not in Greenwich, England*/
            lab = e.toLocaleString('default', {month: 'short'});
            x[i] = {'v': d, 'label': lab};
          }
          return x
         }"

现在具有整个功能的股票代码:

dygraph(data, main = "Revenue & Rate") %>%
  dyAxis("x", rangePad = 40, drawGrid = FALSE, 
         axisLabelFormatter=JS(getMonth),
         ticker = "function(a, b) {
          cDts = ['2015-01-01', '2015-02-01', '2015-03-01', '2015-04-01', 
                  '2015-05-01', '2015-06-01', '2015-07-01', '2015-08-01',
                  '2015-09-01', '2015-10-01','2015-11-01', '2015-12-01'];
          x = [];
          for(i = 0; i < cDts.length; i++) {
            d = Date.parse(cDts[i]);
            e = new Date(cDts[i]);
            e.setDate(e.getDate() + 1); /*assuming you're not in Greenwich, England*/
            lab = e.toLocaleString('default', {month: 'short'});
            x[i] = {'v': d, 'label': lab};
          }
          return x
         }") %>%
  dyAxis("y", label = "Revenue", 
         valueRange = c(0, 100000), independentTicks = TRUE)%>%
  dyAxis("y2", label = "Rate ",
         valueRange = c(0, 10), independentTicks = TRUE) %>%
  dyBarSeries('revenue', label="revenue",color = "#0099F9") %>% 
  dySeries('rate', label="rate", color = "#15354A", axis=('y2'), 
           strokeWidth=4, pointSize=3, drawPoints=TRUE)

这是这个 R 和 JS 调用dygraph的结果:

在此处输入图像描述

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM