Итерация и получить уникальные значения из JSON для некоторых индексов

Question

Я получаю данные обратно из моего PHP с помощью запроса, как это:

SELECT objective,signal_type,signal_name FROM signals WHERE channel="Email"

данные поступают обратно, как это:

[ 
    { 
     "objective": "Awareness", 
     "signal_type": "Efficiency", 
     "signal_name": "CPM" 
    }, 
    { 
     "objective": "Awareness", 
     "signal_type": "Quality", 
     "signal_name": "Click-thru Rate" 
    }, 
    { 
     "objective": "Awareness", 
     "signal_type": "Quality", 
     "signal_name": "Frequency" 
    }, 
    { 
     "objective": "Awareness", 
     "signal_type": "Quality", 
     "signal_name": "Interaction Rate" 
    }, 
    { 
     "objective": "Awareness", 
     "signal_type": "Quality", 
     "signal_name": "Viewability" 
    }, 
    { 
     "objective": "Awareness", 
     "signal_type": "Volume", 
     "signal_name": "Display Time" 
    }, 
    { 
     "objective": "Awareness", 
     "signal_type": "Volume", 
     "signal_name": "Impression" 
    }, 
    { 
     "objective": "Awareness", 
     "signal_type": "Volume", 
     "signal_name": "Reach" 
    }, 
    { 
     "objective": "Conversion", 
     "signal_type": "Efficiency", 
     "signal_name": "Cost per Action" 
    }, 
    { 
     "objective": "Conversion", 
     "signal_type": "Efficiency", 
     "signal_name": "ROI/ROAS" 
    }, 
    { 
     "objective": "Conversion", 
     "signal_type": "Quality", 
     "signal_name": "Avg Order Value" 
    }, 
    { 
     "objective": "Conversion", 
     "signal_type": "Volume", 
     "signal_name": "Conversion" 
    }, 
    { 
     "objective": "Conversion", 
     "signal_type": "Volume", 
     "signal_name": "Revenue" 
    }, 
    { 
     "objective": "Engagement", 
     "signal_type": "Efficiency", 
     "signal_name": "Cost per Click" 
    }, 
    { 
     "objective": "Engagement", 
     "signal_type": "Quality", 
     "signal_name": "Avg Interaction Time" 
    }, 
    { 
     "objective": "Engagement", 
     "signal_type": "Quality", 
     "signal_name": "Conversion Rate" 
    }, 
    { 
     "objective": "Engagement", 
     "signal_type": "Volume", 
     "signal_name": "Click" 
    }, 
    { 
     "objective": "Engagement", 
     "signal_type": "Volume", 
     "signal_name": "Interaction" 
    }, 
    { 
     "objective": "Engagement", 
     "signal_type": "Volume", 
     "signal_name": "Interaction Time" 
    } 
] 

я могу добавить все это к столу так:

$.each(data, function(index, key) { 
$('#myTable').append('<tr><td>'+key.objective+'</td><td>'+key.signal_type+'</td><td>'+key.signal_name+'</td></tr>'); 
       }); 

Это дает совершенно точный стол, но не приятный для глаз стол. Я получаю что-то вроде этого:

| Signal Type | Signal Types | Available Signals | 
|-------------|--------------|----------------------| 
| Awareness | Efficiency | CPM     | 
| Awareness | Quality  | Click-thru Rate  | 
| Awareness | Quality  | Frequency   | 
| Awareness | Quality  | Interaction Rate  | 
| Awareness | Quality  | Viewability   | 
| Awareness | Volume  | Display Time   | 
| Awareness | Volume  | Impression   | 
| Awareness | Volume  | Reach    | 
| Conversion | Efficiency | Cost per Action  | 
| Conversion | Efficiency | ROI/ROAS    | 
| Conversion | Quality  | Avg Order Value  | 
| Conversion | Volume  | Conversion   | 
| Conversion | Volume  | Revenue    | 
| Engagement | Efficiency | Cost per Click  | 
| Engagement | Quality  | Avg Interaction Time | 
| Engagement | Quality  | Conversion Rate  | 
| Engagement | Volume  | Click    | 
| Engagement | Volume  | Interaction   | 
| Engagement | Volume  | Interaction Time  | 

(Обратите внимание, что заголовок «жестко» в моем HTML)

Что я идеально хотел бы иметь что-то вроде этого:

| Signal Type | Signal Types | Available Signals | 
|-------------|--------------|----------------------| 
| Awareness | Efficiency | CPM     | 
|    | Quality  | Click-thru Rate  | 
|    |    | Frequency   | 
|    |    | Interaction Rate  | 
|    |    | Viewability   | 
|    | Volume  | Display Time   | 
|    |    | Impression   | 
|    |    | Reach    | 
| Conversion | Efficiency | Cost per Action  | 
|    |    | ROI/ROAS    | 
|    | Quality  | Avg Order Value  | 
|    | Volume  | Conversion   | 
|    |    | Revenue    | 
| Engagement | Efficiency | Cost per Click  | 
|    | Quality  | Avg Interaction Time | 
|    |    | Conversion Rate  | 
|    | Volume  | Click    | 
|    |    | Interaction   | 
|    |    | Interaction Time  | 

Разница здесь в том, что в столбцах есть разные значения, основанные на столбце раньше. Любые мысли о том, как добраться до этого выхода? Обратите внимание, что я могу настроить свой SQL-запрос или свой javascript/jquery (или оба) в зависимости от того, что наиболее эффективно.

Answer 1

Проверьте, используется ли значение раньше. Если это так, напечатайте пустую строку, если не напечатайте новое значение.

Это приводит к коду добавляющего:

storedObjective = ""; 
storedSignal_type = ""; 
$.each(data, function(index, key) { 

    if (key.objective == storedObjective) 
    { 
     print_1 = ""; 
    } 
    else 
    { 
     print_1 = objective; 
     storedObjective = key.objective; 
    } 
    if (key.signal_type == storedSignal_type) 
    { 
     print_2 = ""; 
    } 
    else 
    { 
     print_2 = key.signal_type; 
     storedSignal_type = key.signal_type; 
    } 

    $('#myTable').append('<tr><td>'+print_1+'</td><td>'+print_2+'</td><td>'+key.signal_name+'</td></tr>'); 
});