Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Как заполнить двухмерный массив произвольными номерами цветов (рандомно) (https://javascript.ru/forum/events/71224-kak-zapolnit-dvukhmernyjj-massiv-proizvolnymi-nomerami-cvetov-randomno.html)

Tungusv 04.11.2017 14:32

Заключить в script тоже самое?
 
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var n = 2, m = 9;
var colorRandom = function randomInteger(min, max) {
var rand = min + Math.random() * (max + 1 - min);
rand = Math.floor(rand);
return rand;
}
var mas = [];
for (var i = 0; i < m; i++){

mas[i] = [];

for (var j = 0; j < n; j++){
mas[i][j] = colorRandom(0, 255);
}}

var table = document.createElement('table'),

tr = table.appendChild(document.createElement('tbody'))

.appendChild(document.createElement('tr'));

for (i = 1; i < 9; i++) {

tr.appendChild(document.createElement('td'));

};
document.body.appendChild(table);

</script>
</body>
</html>

рони 04.11.2017 14:41

Tungusv,
[HTML  run]тут ваш код[/HTML]

Tungusv 04.11.2017 14:46

Тэг script тоже работает
 
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var n = 2, m = 9;
var colorRandom = function randomInteger(min, max) {
var rand = min + Math.random() * (max + 1 - min);
rand = Math.floor(rand);
return rand;
}
var mas = [];
for (var i = 0; i < m; i++){

mas[i] = [];

for (var j = 0; j < n; j++){
mas[i][j] = colorRandom(0, 255);
}}

var table = document.createElement('table'),

tr = table.appendChild(document.createElement('tbody'))

.appendChild(document.createElement('tr'));

for (i = 1; i < 9; i++) {

tr.appendChild(document.createElement('td'));

};
document.body.appendChild(table);

</script>
</body>
</html>

Tungusv 04.11.2017 14:47

<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>


var n = 2, m = 9;
var colorRandom = function randomInteger(min, max) {
var rand = min + Math.random() * (max + 1 - min);
rand = Math.floor(rand);
return rand;
}
var mas = [];
for (var i = 0; i < m; i++){

mas[i] = [];

for (var j = 0; j < n; j++){
mas[i][j] = colorRandom(0, 255);
}}

var table = document.createElement('table'),

tr = table.appendChild(document.createElement('tbody'))

.appendChild(document.createElement('tr'));

for (i = 1; i < 9; i++) {

tr.appendChild(document.createElement('td'));

};
document.body.appendChild(table);
[/html];
</script>
</body>
</html>

рони 04.11.2017 14:56

создание таблицы
 
Tungusv,
<!DOCTYPE HTML>

<html>

<head>
  <title></title>
  <meta charset="utf-8">
<style type="text/css">
td{
   height: 22px; width: 22px; text-align: center;
}
</style>
</head>

<body >

<script>


function createTable(row, col, parent)
{
   var table = document.createElement('table'), arr = [];
   for (var i=0; i<row; i++)  {
     var tr = table.insertRow(i); arr[i] = [];
     for (var j=0; j< col; j++)  {
         var td = tr.insertCell(j)
         var color = ("000000" + (Math.random() * 16777215 | 0).toString(16)).slice(-6);
         td.style.backgroundColor = "#" + color;
         arr[i].push(color)
     }
   }
  parent.appendChild(table)
  return arr
}
var body  =  document.body;
var mas = createTable(3, 8, body);
console.log(mas);

</script>
</body>

</html>

Tungusv 04.11.2017 15:04

а в другом массиве эти цвета можно будет сортировать по возростанию значений построчно?

рони 04.11.2017 15:11

Tungusv,
массив mas сортируйте, как вам хочется.

Tungusv 04.11.2017 16:12

Как взять этот же массив и из первого массива и отсортировать ?

рони 04.11.2017 16:25

Tungusv,
<!DOCTYPE HTML>

<html>

<head>
  <title></title>
  <meta charset="utf-8">
<style type="text/css">
td{
   height: 22px; width: 80px; text-align: center;
}
</style>
</head>

<body >

<script>


function createTable(row, col, parent, masColor)
{
   var table = document.createElement('table'), arr = [];
   for (var i=0; i<row; i++)  {
     var tr = table.insertRow(i); arr[i] = [];
     for (var j=0; j< col; j++)  {
         var td = tr.insertCell(j)
         var color = masColor ? masColor[i][j] : ("000000" + (Math.random() * 16777215 | 0).toString(16)).slice(-6);
         td.style.backgroundColor = "#" + color;
         td.textContent = parseInt(color, 16);
         arr[i].push(color)
     }
   }
  parent.appendChild(table)
  return arr
}
var body  =  document.body;
var mas = createTable(3, 8, body);
console.log(mas);
var new_mas = mas.map(function(ar) {
return ar.sort(function(a,b) {
  return parseInt(a, 16) - parseInt(b, 16)
})
})
console.log(new_mas);
createTable(3, 8, body, new_mas);

</script>
</body>

</html>

Tungusv 04.11.2017 18:06

Цвет мне нужен в цифрах и буквах и чтоб во 2м массиве было тожечто и в 1м толк. отсор
 
Попытался исправить твой код и что то только так получилось
<html lang="en">
<head>
	<meta charset="UTF-8">	
	<title>Document</title>
</head>
<body>
  <style>
  td{
   height: 30px; width: 80px; text-align: center;
}

  </style>
  <script>
function compareNumeric(a, b) {
  if (a > b) return 1;
  if (a < b) return -1;
}    
function createTable(row, col, parent){
   var table = document.createElement('table'), mas = [];
   for (var i=0; i<row; i++)  {
     var tr = table.insertRow(i); mas[i] = [];

     for (var j=0; j< col; j++)  {
         var td = tr.insertCell(j);
         var color = ("000000" + (Math.random() * 16777215 | 0).toString(16)).slice(-6);
         td.innerHTML = "#" + color;
         mas[i].push(color);
   }
   }
  parent.appendChild(table);
  return mas;
}
var body  =  document.body;
var tbl = createTable(2, 9, body);
var new_mas = mas.map(function(ar) {
return ar.sort(function(a,b) {
return parseInt(a, 16) - parseInt(b, 16)
})
})
console.log(new_mas);
createTable(2, 9, body, new_mas);
  </script>
  </body>
</html>


Часовой пояс GMT +3, время: 19:06.