Отслеживание событий Google Analytics на слайдере диапазона JqueryUI
Итак, у меня есть простой ползунок диапазона пользовательского интерфейса JQuery с двумя ручками, как показано в этот JSFiddle..
HTML
<p class = "results-val">
<span class = "min-val">0 </span>to
<span class = "max-val"> 30</span> days
</p>
<div id = "slider"></div>
JS
$(function(){
$( "#slider" ).slider({
range: true,
min: -60,
max: 60,
step: 5,
values: [ 0, 30 ],
slide: function(event, ui) {
$(".min-val").text(ui.values[0] + " ");
$(".max-val").text(" " + ui.values[1]);
}
});
});
На практике этот ползунок действует как фильтр для нашего приложения Dashboard, оценивая данные, отображаемые в отношении результатов пользователя, на основе диапазона значений дня.
С помощью Google Analytics мы хотим отслеживать различные перестановки позиций ручки. Для ясности, когда я говорю о перестановках, я имею в виду следующее:
«От 0 до 30 дней» - это одна перестановка.
«От -5 до 15 дней» - это еще одна перестановка.
«От -40 до 0 дней» - это еще одна перестановка.
Итак, есть масса перестановок.
Моя идея состоит в том, чтобы иметь два события, по одному для каждого дескриптора ползунка, с текущей позицией шага дескриптора в качестве передаваемого значения:
Category: Filtering,
Action: Adjustment,
Label: leftHandle,
Value: stepPos
Category: Filtering,
Action: Adjustment,
Label: rightHandle,
Value: stepPos
Однако здесь есть проблема. Хотя этот подход действительно будет сообщать среднее значение для каждого дескриптора индивидуально,, мы хотим видеть оба значения все вместе. Как указано выше, для нас важно знать самые популярные «перестановки» с одной перестановкой, состоящей как из значения положения левого маркера, так и из значение положения правой ручки.
Если у кого-то есть предложения по настройке этой логики, это было бы замечательно. Спасибо.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Вы можете поместить оба значения в строку, разделенную запятыми.
Вы можете отклонить событие ползунка, чтобы записывать только те значения, которые пользователь сохраняет более одной или двух секунд.
var globalLeft, globalRight;
$(function(){
$( "#slider" ).slider({
range: true,
min: -60,
max: 60,
step: 5,
values: [ 0, 30 ],
slide: function(event, ui) {
$(".min-val").text(ui.values[0] + " ");
$(".max-val").text(" " + ui.values[1]);
globalLeft = ui.values[0];
globalRight = ui.values[1];
$.debounce(1300, doPingGa)
}
});
});
function doPingGa() {
ga('send', 'event', 'Filtering', 'RangeAdjust', globalLeft+','+globalRight);
}