2015-05-12 1 views
0

Существует довольно сложная задача для решения следующей проблемы.Сопоставление отдельных объектов Javascript, а затем добавление последнего объекта

У меня есть следующий массив и JavaScript объектов:

Вход:

У меня есть три разных цвета (blue,green,yellow) и три различных размера (sz=9,11,13) в яваскрипте объектов и пытаюсь отобразить их.

color=["blue","green","yellow"]; 

myObj=[{x:0,y:1,sz:9},{x:4,y:11,sz:9},{x:11,y:17,sz:11},{x:29,y:18,sz:13}]; 

Выход:

data1:[{x:0,y:1,sz:9,color:"blue"},{x:4,y:11,sz:9,color:"blue"}]; 
data2:[{x:4,y:11,sz:9,color:"green"},{x:11,y:17,sz:11,color:"green"}]; 
data3:[{x:11,y:17,sz:11,color:"yellow"},{x:29,y:18,sz:13,color:"yellow"}]; 

Вот jsfiddle, отображающих объекты, основанные на их sz собственности и добавляет color свойства. Единственное, чего не хватает, это добавить последний объект и изменить цвет.

Например:

data2 «S первый объект приходит от data1» последнего объекта s, кроме другого цвета, который является зеленый.

Вот что у меня есть:

data2:[{x:11,y:17,sz:11,color:"green"}];

Вот что мне нужно:

data2:[{x:4,y:11,sz:9,color:"green"},{x:11,y:17,sz:11,color:"green"}];

+1

Что вы имеете в виду, «* сортировать их на основе на их предопределенный массив размеров * "? Почему бы просто не отсортировать по свойству '.sz'? И разве этот массив уже не отсортирован? – Bergi

+0

'size' array фактически также может быть использован для сортировки объекта на основе его свойства' s'. – casillas

+0

Я еще не понял, я не вижу сортировки в этой скрипке. Вы хотите 'color [size.indexOf (obj.sz)]'? Или у вас есть проблема с конструированием этого объекта 'индексов' из' size'? – Bergi

ответ

1

Я думаю, что нужно что-то вроде этого:

Извините за то, я удалил старый код.

UPDATE 3:

https://jsfiddle.net/kxhsapad/3/

OLD ЗАПРОС:

var size = [9, 11, 13, 15]; 
var colorA = ["blue", "green", "yellow", "red"]; 

var myObj = [{x:0,y:1,sz:9},{x:4,y:11,sz:9},{x:11,y:17,sz:11},{x:29,y:18,sz:13},{x:39,y:15,sz:15}]; 
var d1 = []; 
var d2 = []; 
for (var i = 0; i < size.length; i++) { 

    d1 = []; 
    d1[0] = myObj[i]; 
    d1[0].color = colorA[i]; 
    d1[1] = myObj[i + 1]; 
    d1[1].color = colorA[i]; 
    d2.push(d1); 
} 
for (var i = 0; i < d2.length; i++) { 
    for (var j = 0; j < d2[i].length; j++) { 
     var html = '<div id="' + i + '_' + j + '"'; 
     if (j%2==0) html += ' style="float:left;"'; 
     html += '>x=' + d2[i][j].x + ';y=' + d2[i][j].y + ';sz=' + d2[i][j].sz + ';color=' + d2[i][j].color + ';</div>'; 
     $('#container').append(html); 
    } 
} 

Пожалуйста, проверьте jsfiddle для полного кода https://jsfiddle.net/kxhsapad/

+0

Не могли бы вы дать jsfiddle или jsbin для тестирования? – casillas

+0

В строке 3 есть ошибка, так как 2d является 'undefined', также вы нажимаете ссылки на объекты, поэтому, если вы изменяете один цвет, вы изменяете их все одновременно. – axelduch

+0

@ilyasUyanik, я вставил новый код, удалил старый, потому что ошибся. Извините за это –