Переупорядочивание div с помощью Matrix-Calculation (в соответствии с НЕСКОЛЬКИМИ значениями атрибутов данных)

У меня есть список продуктов, которые я хочу отсортировать. Сортировка по цене и продолжительности очень проста. Но я также хочу найти ЛУЧШИЙ продукт в целом.

Вот что у меня есть до сих пор:

   var divList = $(".listing-item");

    /* -------------------------------------- */

    $("#btnPrice").click(function () {
       divList.sort(function(a, b) { 
         return $(a).data("price")-$(b).data("price")
       });
       $("#list").append(divList);
    });
    
    /* -------------------------------------- */

    $("#btnDuration").click(function () {
       divList.sort(function(a, b) { 
         return $(a).data("duration")-$(b).data("duration")
       });
       $("#list").append(divList);
    });

    /* -------------------------------------- */
    
    $("#btnBest").click(function () {
       /* TBD */
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="list">
    <div class="listing-item" data-price="20" data-duration="400" data-stops="3">Price 20, Duration 400, Stops 3</div>
    <div class="listing-item" data-price="30" data-duration="350" data-stops="3">Price 30, Duration 350, Stops 3</div>
    <div class="listing-item" data-price="10" data-duration="700" data-stops="2">Price 10, Duration 700, Stops 2</div>
    <div class="listing-item" data-price="40" data-duration="500" data-stops="1">Price 40, Duration 500, Stops 1</div>
</div>

    <button id="btnPrice" type="button">Sort by price</button>
    <button id="btnDuration" type="button">Sort by duration</button>
    <button id="btnBest" type="button">Sort by overall best</button>

ЛУЧШИЙ в целом продукт должен иметь дешевую цену, небольшую продолжительность и как можно меньше остановок.

Я думаю о своего рода «матричном расчете», сравнивая каждый фактор каждого продукта с тем же атрибутом всех других продуктов. В конце у нас будет сумма результатов всех факторов.

e.g. 

Product 1 has price of 20 and duration of 400 and stops = 3.
Product 2 has price of 30 and duration of 350 and stops = 3.

Я бы рассчитал так:

А

20/30 = 0.66
400/350 = 1.14
3/3 = 1
SUM = 1.8

Б

30/20 = 1.5
350/400 = 0.875
3/3 = 1
SUM = 2.375

В этом расчете продукт A выигрывает, потому что сумма всех факторов меньше, чем сумма всех факторов для продукта B.

Пока для теории. Но как я могу добиться этого с помощью JS??


javascript jquery matrix calculation jquery-calculation
person JonSnow    schedule 22.02.2018    source источник
comment
(1) Как вы рассчитываете сумму? (2) В чем смысл разделения свойств одного продукта на другой? (3) Как вы собираетесь сравнивать более двух товаров?   -  person GalAbra    schedule 22.02.2018
comment
1+2+3: У меня пока нет решения. Для а) я думаю, что буду хранить результаты в массиве и затем сохранять их в другом атрибуте данных, чтобы я мог отсортировать свой список по сумме результатов каждого продукта. Для b): мой способ найти лучший фактор. Наименьшая сумма = лучший продукт. Для c) есть цикл о каждом продукте, я думаю   -  person JonSnow    schedule 23.02.2018
comment
это ответы на заданные мной вопросы?   -  person GalAbra    schedule 23.02.2018
comment
Да, они есть.   -  person JonSnow    schedule 23.02.2018

Ответы (1)


arrow_upward
0
arrow_downward

хорошо, я смог решить это сейчас.

$("#btnBest").click(function () {

   var Price = [];
   var Duration = [];
   var Stops = [];

   divList.each(function() {

       Price.push($(this).data('price'));
       Duration.push($(this).data('duration'));
       Stops.push($(this).data('stops'));

   });


   for(i=0; i< divList.length; i++) {

       var PriceSum = 0;
       var DurationSum = 0;
       var StopsSum = 0;
       var OverallSum = 0;

       for(j=0; j < divList.length; j++) {

           var newPriceSum = Price[i] / Price[j];
           var newDurationSum = Duration[i] / Duration[j];
           var newStopsSum = Stops[i] / Stops[j];

           PriceSum = PriceSum + newPriceSum;
           DurationSum = DurationSum + newDurationSum;
           StopsSum = StopsSum + newStopsSum;
       }

       var OverallSum = PriceSum + DurationSum + StopsSum;
       $(".listing-item" ).eq( i ).attr("data-sum", OverallSum);

       //console.log(i + ": " + PriceSum + " + " + DurationSum + " + " + StopsSum + " = " + OverallSum);

    } 

    divList.sort(function(a, b) { 
        return $(a).data("sum")-$(b).data("sum")
    });
    $("#list").append(divList);

});

См. рабочий Fiddle, если интересно. https://jsfiddle.net/SchweizerSchoggi/k3af7pb0/

person JonSnow    schedule 23.02.2018