获取Google Charts工具提示以显示字符串而不是数字-Java 学习之路

我正在使用一组对象来创建一个使用Google Tables的饼图：

var sitesData = 
{title: "Practice Session", 
url: "https://app106.studyisland.com/cfw/test/practice-s…
gCount=9b1c6&qgList=bf1b20ed&appRnd=1519683586003", 
time: 3.157999999999999, 
seconds: " 3s"
}

我必须使用字符串值和时间值创建一个饼图，但我希望工具提示显示它们悬停在饼图上的秒数 . 以下是我的代码：

function drawChart() {
    let data = new google.visualization.DataTable();
    data.addColumn('string', 'Title');
    data.addColumn('number', 'Time');

    for (let i = 0; i < sitesData.length; i++) {
        data.addRow([sitesData[i].title, sitesData[i].time]);
    }

    data.addColumn({type: 'string', role: 'tooltip'});
    for (let i = 0; i < sitesData.length; i++) {
        data.addRow([sitesData[i].seconds]);
    }

    let options = {
        tooltip: {isHtml: true},
        'title': 'Sites Logged',
        'width': 600,
        'height': 400,
        pieHole: 0.3
    };

    let chart = new 
 google.visualization.PieChart(document.getElementById('chart_div'));
    chart.draw(data, options);
}

我一直在：

“错误：给出的行大小不同于3（表中的列数） . ”

任何帮助，将不胜感激 .

1 回答

错误来自 addRow 方法

传递给 addRow 的数组必须具有与数据表中的列相同数量的值...

在这种情况下，为工具提示添加第三列，
但是只给了一个值 addRow

data.addColumn({type: 'string', role: 'tooltip'});  // <-- third column
for (let i = 0; i < sitesData.length; i++) {
  data.addRow([sitesData[i].seconds]);  // <-- only one value, needs three
}

但你不需要循环两次，只需在 for 循环之前添加工具提示列...

// 3 columns
let data = new google.visualization.DataTable();
data.addColumn('string', 'Title');
data.addColumn('number', 'Time');
data.addColumn({type: 'string', role: 'tooltip'});

for (let i = 0; i < sitesData.length; i++) {
  // 3 values
  data.addRow([sitesData[i].title, sitesData[i].time, sitesData[i].seconds.toString()]);
}

否则，您可以使用方法 setValue 作为工具提示，
如果由于某种原因你需要循环两次......

let data = new google.visualization.DataTable();
data.addColumn('string', 'Title');
data.addColumn('number', 'Time');

for (let i = 0; i < sitesData.length; i++) {
  data.addRow([sitesData[i].title, sitesData[i].time]);
}

data.addColumn({type: 'string', role: 'tooltip'});
for (let i = 0; i < sitesData.length; i++) {
  data.setValue(i, 2, sitesData[i].seconds.toString());  // <-- use setValue instead
}

回复于 2024-05-05T01:17:20+08:00

获取Google Charts工具提示以显示字符串而不是数字

1 回答

相关问题