topic TimeSilder heatmap in ArcGIS JavaScript Maps SDK Questions

TimeSilder heatmap

BraulioCordova — Tue, 11 Aug 2020 19:50:08 GMT

I have a layer that represents a heat map. When I run the filter with a timeslider, it doesn't work. Imagen(captura.png).

I think the problem lies in how the date is being captured, since in my table it is found as datetime type: YYYY-MM-DD.
I have tried to convert the captured date and I cannot find the solution yet. Please I need help.Robert Scheitlin, GISP‌ArcGIS API for JavaScript

view.whenLayerView(layer).then(function(lv) {
layerView = lv;
const start = new Date(2020, 0, 1);
timeSlider.fullTimeExtent = {
start: start,
end: layer.timeInfo.fullTimeExtent.end
};

const end = new Date(start);
end.setDate(end.getDate() + 30);
timeSlider.values = [start, end];

});

timeSlider.watch("timeExtent", function() {
alert(timeSlider.timeExtent.end.getTime());
layer.definitionExpression ="time <= " + timeSlider.timeExtent.end.getTime(); // here I think it's a problem
layerView.effect = {
filter: {
timeExtent: timeSlider.timeExtent,
geometry: view.extent
},
excludedEffect: "grayscale(20%) opacity(12%)"
};
});

Re: TimeSilder heatmap

BraulioCordova — Sat, 11 Dec 2021 22:21:23 GMT

solution

const timeSlider = new TimeSlider({

container: "timeSlider",

mode: "time-window",

view: mapView

});

timeSlider.layout = "compact";

//mapView.ui.add(timeSlider, "bottom-left");

mapView.whenLayerView(layer).then(function(lv) {

const fullTimeExtent = layer.timeInfo.fullTimeExtent;

const start = fullTimeExtent.start;

const end = fullTimeExtent.end;

timeSlider.fullTimeExtent = {

start: start,

end: end

};

timeSlider.values = [new Date(2020, 3, 1),end];

});

timeSlider.watch("timeExtent", function() {

layer.definitionExpression ="id_dist='"+ubigeo+"' and (time >= " +"'"+intl.formatDate(timeSlider.timeExtent.start.getTime(), intl.convertDateFormatToIntlOptions("short-date-short-time"))+"'"+" and time <= "+"'" +intl.formatDate(timeSlider.timeExtent.end.getTime(), intl.convertDateFormatToIntlOptions("short-date-short-time"))+"'"+")";

});