用 d3/linechart 换行

Question

我正在尝试用 R 的 ggplot2 和 rCharts/d3 库（数据框 df 进一步定义）复制以下图表：

ggplot(data = df, aes(x = Year, y = value, 
    group = interaction(variable,Category), 
    colour = variable, shape = variable)) + geom_line()

我无法按变量的相互作用进行分组，如 ggplot 示例：

nPlot(data = df, value ~ Year, 
    group = 'variable', 
    type = 'lineChart')

不幸的是，这两个系列的最后一点和第一点是相连的（在 1870 年和 2010 年之间），这当然是不可取的。将 group = 'variable' 替换为 group = interaction(df$variable, df$Category) 之类的内容没有任何用处。

有什么想法可以不连接两个系列的点吗？

这里有一个相关的 SO 问题 Drawing non-continuous lines with d3，答案看起来很有希望。但是来自 rCharts 并且不熟悉 d3 我无法根据我的情况调整那里提出的解决方案。

我尝试改编此处找到的代码 http://bl.ocks.org/mbostock/3035090，SO 答案基于该代码，但我对 d3 不够熟悉和 rCharts 让它工作。我试图做的是添加一个 NaN 数据点而不显示 NaN，这是我在上面的示例中所做的理解。我没有成功，但无论如何这是我的尝试：

df2 <- subset(df, Year %in% 1870)
df2$Year <- 1869  # add non-numeric entry at 1869 
                  # break the interpolation between 1870 and 2010?
df2$value <- NaN
df <- rbind(df, df2)
n <- nPlot(data = df, value ~ Year, group = 'variable', type = 'lineChart')
n$setTemplate(afterScript = 
  '<style>  # code snippet copied from Mike Bostock's example
  var line = d3.svg.line()
    .defined(function(d) { return !isNaN(d.dataValue); })
  </style>')
n

我试过其他变体但没有成功。我也尝试直接编辑 html，但也失败了。

这是复制图表的数据框：

df <- structure(list(Year = c(1870, 1880, 1890, 1900, 1910, 1920, 1930, 
1940, 1950, 1960, 1970, 1980, 1990, 2000, 2010, 1870, 1880, 1890, 
1900, 1910, 1920, 1930, 1940, 1950, 1960, 1970, 1980, 1990, 2000, 
2010, 1870, 1880, 1890, 1900, 1910, 1920, 1930, 1940, 1950, 1960, 
1970, 1980, 1990, 2000, 2010, 1870, 1880, 1890, 1900, 1910, 1920, 
1930, 1940, 1950, 1960, 1970, 1980, 1990, 2000, 2010, 1870, 1880, 
1890, 1900, 1910, 1920, 1930, 1940, 1950, 1960, 1970, 1980, 1990, 
2000, 2010, 1870, 1880, 1890, 1900, 1910, 1920, 1930, 1940, 1950, 
1960, 1970, 1980, 1990, 2000, 2010), Category = structure(c(2L, 
2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 3L, 3L, 
3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 2L, 2L, 2L, 
2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 3L, 3L, 3L, 3L, 
3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 2L, 2L, 2L, 2L, 2L, 
2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 3L, 3L, 3L, 3L, 3L, 3L, 
3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L), .Label = c("National capital", 
"Private capital", "Public capital"), class = "factor"), variable = structure(c(2L, 
2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 
2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 3L, 3L, 3L, 
3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 
3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 3L, 4L, 4L, 4L, 4L, 4L, 
4L, 4L, 4L, 4L, 4L, 4L, 4L, 4L, 4L, 4L, 4L, 4L, 4L, 4L, 4L, 4L, 
4L, 4L, 4L, 4L, 4L, 4L, 4L, 4L, 4L), .Label = c("United States", 
"Germany", "France", "United Kingdom", "Europe"), class = "factor"), 
    value = c(7.1, 6.9, 6.3, 6.5, 6.4, 3.5, 3.8, 2.9, 2.3, 3, 
    3.1, 3.5, 3.6, 3.9, 4.1, 0.7, 0.5, 0.3, 0.4, 0.4, 1, 0.7, 
    0.2, 0.7, 0.9, 0.8, 0.7, 0.4, 0.1, 0, 7.2, 7, 7, 7, 6.7, 
    2.9, 3.8, 2.8, 2.8, 3.2, 3.6, 3.7, 3.7, 5, 6.1, 0.2, -0.4, 
    -0.3, -0.3, -0.3, -0.4, 0.4, -0.3, 0.6, 0.4, 0.5, 0.4, 0.3, 
    0.3, 0.3, 6.7, 6.8, 6.8, 6.8, 6.8, 2.9, 3.6, 2.6, 2.3, 2.8, 
    3.3, 4, 4.6, 4.9, 5.2, -0.2, 0.4, 0.7, 0.3, 0.1, -1.5, -1.5, 
    -1.4, -0.8, -0.3, 0.2, 0.5, 0.3, 0, 0)), .Names = c("Year", 
"Category", "variable", "value"), row.names = c(NA, -90L), class = "data.frame")

Answer 1

通过交互在数据框中创建一个新列，然后在 nPlot 中对该列进行分组，而不是在 nPlot 中进行交互，似乎可以解决问题：

df$interaction=interaction(df$variable,df$Category)
nPlot(data = df, value ~ Year, 
  group = 'interaction', 
  type = 'lineChart')

您可能需要更改图例

用 d3/linechart 换行

breaking a line with d3/linechart

r

d3.js

linechart

rcharts