【问题标题】:Google Timeline - change color of data depending on nameGoogle Timeline - 根据名称更改数据颜色
【发布时间】:2019-09-24 23:13:15
【问题描述】:

我有一个谷歌时间线,如下面的代码所示,并且想要更改任何标题为“黑色”的条目的颜色。 我似乎无法让它工作,我尝试了一些不同的解决方案。这是我的代码:

http://jsfiddle.net/5j0umkcx/1/


HTML:

<div id='chart_div'></div>

Javascript:

var myData = [
        ['Category', 'Name', {role: 'style'}, 'Start', 'End'],
        ['Foo', 'BLACK', '', new Date(2014, 7, 1), new Date(2014, 7, 5)],
        ['Foo', 'Homer', '', new Date(2014, 7, 6), new Date(2014, 7, 8)],
        ['Bar', 'Marge', '', new Date(2014, 7, 2), new Date(2014, 7, 9)]
    ]

        for(i=1;i<myData.length;i++){
    if(myData[i].Name == 'BLACK'){
        data[i].style = '#000000';
    }}


function drawChart() {

    var data = google.visualization.arrayToDataTable(myData);



    var chart = new google.visualization.Timeline(document.querySelector('#chart_div'));
    chart.draw(data, {
        height: 300,
        width: 600
    });
}
google.load('visualization', '1', {packages:['timeline'], callback: drawChart});

【问题讨论】:

  • 顶部 if 语句中的数据将是 undefined,因为它只在函数范围内声明
  • 嗯,我不知道该怎么解决他们的抱歉。你有机会改变jsfiddle吗? (还刚刚注意到我在 if 语句中调用了“数据”,而不是“我的数据”)。更改似乎并没有解决问题。
  • 你的 JSFiddle 不起作用;因为你没有给它任何包 google 来自。如果您查看浏览器控制台,您可以看到 google is not defined
  • 小提琴奏效了——您可能只需要稍等片刻即可加载。谷歌应该在这方面自动工作 - 我已经在多个浏览器和计算机上进行了测试。也许试试 Chrome? (虽然我理解如果你不想帮忙,没关系)。
  • 你说得对,好像我的浏览器阻止了扩展。我会努力让它工作

标签: javascript google-apps-script graph charts timeline


【解决方案1】:

这里的问题是您正在使用arrays,但您将它们视为ObjectsmyData[i] 没有 Name 的属性,因为它是 Array。不过,您可以通过获取myData[i][1](存储名称的数组中的插槽)来访问Name 的位置。你可以用这个替换你的 for 循环代码来改变颜色属性 (myData[i][2])

for(i=1;i<myData.length;i++){
    if(myData[i][1] == 'BLACK'){
        myData[i][2] = '#000000';
    }
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-12-19
    • 1970-01-01
    • 1970-01-01
    • 2020-06-23
    • 1970-01-01
    • 1970-01-01
    • 2017-07-10
    相关资源
    最近更新 更多