谷歌图表 - 获取行的颜色

时间:2012-06-16 10:34:43

标签: javascript charts pie-chart google-visualization

我有一个包含大量元素的饼图。 我已经将颜色选择留给了谷歌图表,但在绘制图表后,我需要检索每一行的颜色。

我知道我可以生成颜色数组,并在图表选项中设置它,这将解决我的问题,我将能够从那里检索颜色。但我真的不想手工创建那个大阵列。

那么有没有办法获得给定行的颜色?

谢谢!

1 个答案:

答案 0 :(得分:0)

我不熟悉谷歌饼图,但我有一个基本的JavaScript建议。也许这有帮助。如果您有画布图像,则可以使用JavaScript像素拾取方法,类似于我使用的以下内容:

//get the image
var sampleImage = document.getElementById("checkimg");
//convert the image to canvas
function convertImageToCanvas(image) {
    var canvas = document.createElement("canvas");
    canvas.width = image.width;
    canvas.height = image.height;
    canvas.getContext("2d").drawImage(image, 0, 0);
    return canvas;
}
var canvas = convertImageToCanvas(sampleImage);
sampleImage.style.display = 'none';
//real position functions
function absleft(el) {
    return (el.offsetParent) ? el.offsetLeft+absleft(el.offsetParent) : el.offsetLeft;
}
function abstop(el) {
    return (el.offsetParent) ? el.offsetTop+abstop(el.offsetParent) : el.offsetTop;
}
canvas.onclick = function(event) {
    //get real position
    if (event.hasOwnProperty('offsetX')) {
        var x = event.offsetX;
        var y = event.offsetY;
    }
    else {
        var x = event.layerX - absleft(canvas);
        var y = event.layerY - abstop(canvas);
    }
    //get the pixel data
    var pixelData = this.getContext('2d').getImageData(x, y, 1, 1).data;
}
document.getElementById("temp").appendChild(canvas);