Получить код скрипта JSON с толкает на карту


У меня есть скрипт, который делает вызов базы данных, а затем фильтрует результаты. После фильтрации она помещает его в массив и показывает его на карте.

Вот моя функция:

function getDriving() {
    pointArray.length = 0;
    markers.length = 0;
    var todayval = new Date();


    var url = $('#map').data('request-url2');
    $.getJSON(url,
        function (data) {
            $.each(data,
                function (i, item) {

                    markers.push({
                        'location': new google.maps.LatLng(item.Latitude, item.Longitude),
                        'map': map,
                        'weight': item.Speed,
                        'radius': 10,
                        'date': item.CurrentDateTime,
                        'imei': item.Imei
                    });
                });
            imei = parseInt($('#selectVehicles').val());

            var startValue = $('#startDate').val().split("/");
            var endValue = $('#endDate').val().split("/");
            var valDateStart = new Date(startValue[2], startValue[1] - 1, startValue[0]);
            var valDateEnd = new Date(endValue[2], endValue[1] - 1, endValue[0]);

            filtered = markers.filter(function (marker) {
                var getDate = marker.date.match(/\d/g).join('');
                var markerDate = new Date(parseFloat(getDate));
                return ((markerDate >= valDateStart && markerDate <= valDateEnd) && marker.imei === imei);
            });
            var pointArray = new google.maps.MVCArray(filtered);

            heatmap = new google.maps.visualization.HeatmapLayer({
                data: pointArray
            });
            heatmap.setMap(map);
        });
};

Он хорошо работает, но я хочу знать, если все в порядке с кодом, или как я могу улучшить его.



473
2
задан 26 января 2018 в 11:01 Источник Поделиться
Комментарии
2 ответа

Область действия переменных

Если imei используется вне код в ваш пост (который будет являться основанием для принятия к теме), то вы должны объявить его как локальные функции, используя var (или let Если вы хотите, чтобы заблокировать область. То же самое верно для filtered и heatmap. Таким образом этих переменных не будет Глобального, что может привести к путанице, если вы использовали var чтобы объявить переменную внутри функции, но не до этого.

Для получения более подробной информации по этой теме см. В разделе сохранить областей и объем даже ближе на этой странице.

Доступ к DOM-элементов несколько раз через $()

Поиск дом медленно. Он мудр, чтобы кэшировать их, как только в переменной, а затем обратиться к переменной, когда это необходимо. Об этом также говорится в вышеупомянутой статье в разделе Кэш Дом просмотров

Эти запросы могут быть добавлены выше функция (возможно, в дом готов работать как в jQuery $(function(){})хоть и утверждается, что не стоит с современных браузерах):

var map = $('#map');
var selectedVehicles = $('#selectVehicles');
var startDate = $('#startDate');
var endDate = $('#endDate');

Затем эти переменные могут быть использованы позже, когда функция выполняется, например:


var url = $('#map').data('request-url2');

Могут быть обновлены для использования map:

var url = map.data('request-url2');

И map также может быть использован при настройке Google карта экземпляр, так как предположительно, что это один и тот же элемент используется для карты.

С помощью parseInt() без радикса

Если вы собираетесь использовать parseInt(), имеет смысл указать основание системы счисления, используя второй параметр - если вы не используете уникальный номер системы, такие как шестнадцатеричные, восьмеричные и т. д. затем укажите 10 для десятичных чисел.


Всегда указывайте этот параметр , чтобы исключить ошибки считывания и гарантировать предсказуемое поведение. Разные реализации могут возвращать разные результаты, если Radix не указан, как правило, недобросовестный значение 10.1

Так что я бы обновить строку:


imei = parseInt($('#selectVehicles').val());

Чтобы пройти радикса 10:

imei = parseInt($('#selectVehicles').val(), 10);

Таким образом, если значение 022 вводится, оно не интерпретируется как восьмеричное значение (т. е. Десятичное число 18).


1https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt#Parameters

2
ответ дан 26 января 2018 в 05:01 Источник Поделиться

Есть много вещей, которые могут быть улучшены, особенно при работе с входов, а затем использовать keyup или blur Так что вам не придется делать много расчетов, когда getDriving() называется.

Я сосредоточусь на $.each()этот метод крайне медленно и может быть решена с родной JavaScript методов, таких как массив.уменьшить().

function (data) {
imei = parseInt($('#selectVehicles').val());

var startValue = $('#startDate').val().split("/");
var endValue = $('#endDate').val().split("/");
var valDateStart = new Date(startValue[2], startValue[1] - 1, startValue[0]);
var valDateEnd = new Date(endValue[2], endValue[1] - 1, endValue[0]);

filtered = data.reduce(function(arr, item){
var getDate = item.CurrentDateTime.match(/\d/g).join('');
var itemDate = new Date(parseFloat(getDate));

if((itemDate >= valDateStart && itemDate <= valDateEnd) && item.Imei === imei){
arr.push({
'location': new google.maps.LatLng(item.Latitude, item.Longitude),
'map': map,
'weight': item.Speed,
'radius': 10,
'date': item.CurrentDateTime,
'imei': item.Imei
});
}
return arr;
}, []);

var pointArray = new google.maps.MVCArray(filtered);

heatmap = new google.maps.visualization.HeatmapLayer({
data: pointArray
});
heatmap.setMap(map);
}

Я в конечном итоге удаление filter как хорошо; когда вы получаете dataможно просто уменьшить время на фактический выпуск вы хотите, а затем просто проверить, если он удовлетворяет условию, а если нет, то не добавляйте его в список.

Кроме того, я заметил, что переменные imei, startValue, endValue, varDateStart и valDateEnd никогда не изменит значение так просто поставить их выше array.reduce().

1
ответ дан 26 января 2018 в 02:01 Источник Поделиться