Javascript R中维度堆叠矩阵的热图[关闭]答案

【问题标题】：Heat Map of Dimensional Stacked Matrix in R of Javascript [closed]Javascript R中维度堆叠矩阵的热图[关闭]
【发布时间】：2016-11-21 11:16:37
【问题描述】：

我不确定我要实现的图形是否称为维度堆叠热图？我刚开始在这个领域工作

如果可能的话，最好的链接是什么，以便我可以实施。基本上它是一个矩阵的网格，具有 4 个子网格，用于矩阵的特定每个元素的子特征，如 S1、S2、S3 和 S4

【问题讨论】：

相信你自己能找到highcharts.com/demo/heatmap
你能提供一些演示代码吗？
@AlexFilatov 您展示的是简单的二维热图，可以在 R 中轻松创建。我想要的是非常不同，二维矩阵的每个元素再次分为 4 个部分 S1、S2 , S3 & S4 正如你在我的问题中看到的那样
@the_skua 我使用 ggplot2 在 R 中绘制了热图，但不知道如何执行此操作，甚至不知道它在实际中的名称

标签： javascript r d3.js heatmap

【解决方案1】：

我想这就是你想要做的，我做了类似的东西。这是小提琴链接。

var canvas = document.getElementById('canvas');
    if (canvas.getContext) {
        var ctx = canvas.getContext('2d');

        var cw = 300;
        var ch = 300;

        var participants = 2;

        var item_h = ch/participants/2;
        var item_w = cw/participants/2;


        var x_inc = cw/participants;
        var y_inc = ch/participants;

        for (x = 0; x < participants; x++) { 
            for (y = 0; y < participants; y++) { 



                ctx.fillStyle="rgb(50,255,255)";
                ctx.fillRect(x*x_inc, y*y_inc, item_w, item_h);
                ctx.fillStyle="rgb(0,255,0)";
                ctx.fillRect(x*x_inc+item_w, y*y_inc, item_w, item_h);
                ctx.fillStyle="rgb(255,0,255)";
                ctx.fillRect(x*x_inc, y*y_inc+item_h, item_w, item_h);
                ctx.fillStyle="rgb(255,255,0)";
                ctx.fillRect(x*x_inc+item_w, y*y_inc+item_h, item_w, item_h);

            }

          }
        }

Fiddle

【讨论】：