Создать цветовую матрицу, используя данные из текстового файла

Question

У меня огромный текстовый файл, и я хочу визуализировать свои данные, создав 1670 матриц размером 180 * 90 и заполнить их чтением данных из моего огромного файла.

Я написал некоторый код и создал 3D-массив, а внутренний массив - это 2D-массив, который равен 180 * 90. Я пытался создать сетку с d3.js, но, к сожалению, у меня нет результата.

Кроме того, я прочитал слишком много документов и проверил много ссылок, таких как:

1. Мышление с объединениями
2. D3.js - объединение данных
3. Давайте создадим сетку с D3.js

и stackoverflow, но я понятия не имею, как я могу сделать. На самом деле, я начинающий с d3.js и JavaScript. Мне нужна помощь, чтобы понять значение сетки в d3 в глубине.

 -------------------------------------------------------------------------   
       //start working with file 
        <div id="D3lines"></div>
        <script>


var myMatrix = new Array(1670)
         for (var i=0; i<myMatrix.length; i++){
                    myMatrix[i] = twodmatrix()}
         function twodmatrix(){
                var myMat = new Array(180)
                for (var i=0; i<myMat.length; i++){
                    myMat[i] = new Array(90)}
                return(myMat)}
        d3.text("tempanomaly_new.txt", function(data){
        var text1 = d3.csv.parseRows(data).map(function(row){ 
                return row.map(function(value) { 
                return +value;}); }); 
            for(var i = 0; i<myMatrix.length; i++){
            myMatrix[i] = text1;}
            console.log(text1);});
        var width = 1670;
        var height = 90;
        var lineGraph = d3.select("#D3lines")
                .append("svg:svg")
                .attr("width", width)    
                .attr("height", height); 
        for (var j1=0; j1 <= width; j1= j1+1) {
         for (var j = 0; j<twodmatrix.length; j = j+ 25){
            lineGraph.append("svg:line")
                .attr("x1", 25)
                .attr("y1", j)
                .attr("x2", 89)
                .attr("y2", j)
                .style("stroke", "rgb(6,120,155)")
                .style("stroke-width", 2);};

        // Using for loop to draw multiple vertical lines
        for (var j=0; j <89; j=j+25) { lineGraph.append("svg:line")
                            .attr("x1", j)
                            .attr("y1", 25)
                                .attr("x2", j)
                            .attr("y2", 179)
                            .style("stroke", "rgb(6,120,155)")
                    .style("stroke-width", 2);};};