以编程方式突出显示 DyGraph 时间序列

Question

我正在组合一个网络应用程序，该应用程序在一个 dygraph 上绘制当年和过去 10 年的天气数据时间序列。我希望相对于过去几年突出显示当年（此时为 2015 年）的时间序列，所以我试图将当年的笔画宽度从默认值 2 增加到 5。我的问题是我我很难让它以编程方式工作。每年的每日数据都是原生数组格式，所以时间序列由数组 Yr0Labels 的内容来标识：

[“日期”、“2005”、“2006”、“2007”、“2008”、“2009”、“2010”、“2011”、“2012”、“2013”​​、“2014”、“2015” "]

明年 1 月 1 日，Yr0Labels 将以编程方式更改为：

[“日期”、“2006”、“2007”、“2008”、“2009”、“2010”、“2011”、“2012”、“2013”​​、“2014”、“2015”、“2016 ”]

在 dygraph 选项参数中，我将默认 strokeWidth 设置为 2，将 2015 年的 strokeWidth 设置为 5。因为我希望在 1 月 1 日之后正确突出显示当前日历年数据，所以我尝试识别要突出显示的系列yr0Labels[11]的内容，

    {
     ……
     strokeWidth: 2,
     labels: yr0Labels,
     series: {  yr0Labels[11] : { strokeWidth: 5} }, 
     ……..
   }

这产生了一个语法错误 - SyntaxError: missing : after property id

怀疑 dygraph 不想在系列标识符中看到数组语法，我尝试通过字符串变量“cyear”来识别系列，

cyear = yr0Labels[11];

    {…strokeWidth: 2, 
         labels: yr0Labels,
         series: {  cyear : { strokeWidth: 5} },
     …….}

这没有产生错误，但也没有突出显示该系列。

我能够完成这项工作的唯一方法是直接输入当前年份值作为系列标识符，

    {…strokeWidth: 2, 
         labels: yr0Labels,
         series : {  ‘2015’ : { strokeWidth: 5} },
     …….}

这行得通，但我必须在每年 1 月 1 日编辑 dygraph 选项参数，以正确制作当前日历年图的数据。

如何以编程方式进行突出显示？

Answer 1

问题在于您如何在 JavaScript 对象文字中使用键。

这个：

{ foo: 'bar' }

等同于：

{ 'foo': 'bar' }

即使范围内有一个名为foo 的变量。为了达到您想要的结果，您需要使用以下内容填写您的对象：

var foo = 'blah';
var o = {};
o[foo] = 'bar';