Javascript 每个单元格具有不同颜色的图表

我正在为我的网站工作，我想创建这样一个图表，其中图表的每个单元格都有不同的颜色，如下图所示：

---

我搜索了

googlecharts

和其他各种基于javascript的api来查找图表，但没有找到。欢迎使用任何解决方案。

使用highcharts，您可以通过电话来实现这一点。在图表上，完成下面的代码循环，y和x记号在每个单元格中添加一个矩形

function (chart) { // on complete

    var xAxis = chart.xAxis[0],
        yAxis = chart.yAxis[0],
        xTicks = xAxis.tickPositions,
        yTicks = yAxis.tickPositions; // some need vars

    for (var i = 0; i < xTicks.length - 1; i++){
        for (var j = 0; j < yTicks.length - 1; j++){ // loop, xTicks and yTicks
            var startX = xAxis.toPixels(xTicks[i]);
            var stopX = xAxis.toPixels(xTicks[i+1]);
            var startY = yAxis.toPixels(yTicks[j+1]);
            var stopY = yAxis.toPixels(yTicks[j]); // determine intersections of ticks

            chart.renderer.rect(startX, startY, stopX-startX,stopY- startY, 0)
            .attr({
                fill: '#'+Math.floor(Math.random()*16777215).toString(16), // random color for http://www.paulirish.com/2009/random-hex-color-code-snippets/
                zIndex: 1
            })
            .add(); // place rect for each cell

        }

    }

函数（图表）{//on完成
var xAxis=chart.xAxis[0]，
yAxis=chart.yAxis[0]，
xTicks=xAxis.tick位置，
yTicks=yAxis.tickPositions；//有些需要变量
对于（var i=0；i

小提琴。产生：

---

你必须对正在渲染的div图表做些什么，比如背景图像或其他东西。这是你的整个图表，还是你在寻找一个混合图表？（顶部有另一个图表的彩色单元格？@Chloe）。是的，实际上，我希望这些颜色作为图表的背景，并在上面显示数据。