tsai
/
thingsboard
mirror of https://github.com/thingsboard/thingsboard.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Fix calculate trip to big interval time (#2161)

pull/2163/head
Vladyslav 7 years ago
committed by Igor Kulikov
parent
ac8e67eff0
commit
1059c21eab
2 changed files with 136 additions and 150 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 274
      ui/src/app/widget/lib/tripAnimation/trip-animation-widget.js
  2. 12
      ui/src/app/widget/lib/tripAnimation/trip-animation-widget.tpl.html

274
ui/src/app/widget/lib/tripAnimation/trip-animation-widget.js
View File

@ -128,7 +128,8 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
vm.index = 0;
vm.dsIndex = 0;
vm.minTime = 0;
vm.maxTime = 0;
vm.minTimeIndex = 0;
vm.maxTimeIndex = 0;
vm.isPlaying = false;
vm.trackingLine = {
"type": "FeatureCollection",
@ -200,10 +201,10 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
vm.moveNext = function () {
vm.stopPlay();
if (vm.staticSettings.usePointAsAnchor) {
let newIndex = vm.maxTime;
for (let index = vm.index+1; index < vm.maxTime; index++) {
let newIndex = vm.maxTimeIndex;
for (let index = vm.index + 1; index < vm.maxTimeIndex; index++) {
if (vm.trips.some(function (trip) {
return trip.timeRange[index].hasAnchor;
return calculateCurrentDate(trip.timeRange, index).hasAnchor;
})) {
newIndex = index;
break;
@ -216,27 +217,27 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
vm.movePrev = function () {
vm.stopPlay();
if (vm.staticSettings.usePointAsAnchor) {
let newIndex = vm.minTime;
for (let index = vm.index-1; index > vm.minTime; index--) {
let newIndex = vm.minTimeIndex;
for (let index = vm.index - 1; index > vm.minTimeIndex; index--) {
if (vm.trips.some(function (trip) {
return trip.timeRange[index].hasAnchor;
})) {
return calculateCurrentDate(trip.timeRange, index).hasAnchor;
})) {
newIndex = index;
break;
}
}
moveToIndex(newIndex);
} else moveInc(-1);
} else moveInc(-1);
};
vm.moveStart = function () {
vm.stopPlay();
moveToIndex(vm.minTime);
moveToIndex(vm.minTimeIndex);
};
vm.moveEnd = function () {
vm.stopPlay();
moveToIndex(vm.maxTime);
moveToIndex(vm.maxTimeIndex);
};
vm.stopPlay = function () {
@ -252,8 +253,9 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
}
function moveToIndex(newIndex) {
if (newIndex > vm.maxTime || newIndex < vm.minTime) return;
if (newIndex > vm.maxTimeIndex || newIndex < vm.minTimeIndex) return;
vm.index = newIndex;
vm.animationTime = vm.minTime + vm.index * vm.staticSettings.normalizationStep;
recalculateTrips();
}
@ -263,12 +265,6 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
})
}
function findAngle(lat1, lng1, lat2, lng2) {
let angle = Math.atan2(0, 0) - Math.atan2(lat2 - lat1, lng2 - lng1);
angle = angle * 180 / Math.PI;
return parseInt(angle.toFixed(2));
}
function initialize() {
$scope.currentDate = $filter('date')(0, "yyyy.MM.dd HH:mm:ss");
@ -445,7 +441,7 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
}
}
function configureTripSettings(trip, index, apply) {
function configureTripSettings(trip, apply) {
trip.settings = {};
trip.settings.color = calculateColor(trip);
trip.settings.polygonColor = calculatePolygonColor(trip);
@ -478,17 +474,17 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
let labelText = vm.staticSettings.label;
if (vm.staticSettings.useLabelFunction && angular.isDefined(vm.staticSettings.labelFunction)) {
try {
labelText = vm.staticSettings.labelFunction(vm.ctx.data, trip.timeRange[vm.index], trip.dsIndex);
labelText = vm.staticSettings.labelFunction(vm.ctx.data, calculateCurrentDate(trip.timeRange, vm.index), trip.dsIndex);
} catch (e) {
labelText = null;
}
}
labelText = vm.utils.createLabelFromDatasource(trip.dataSource, labelText);
labelReplaceInfo = processPattern(labelText, vm.ctx.datasources, trip.dSIndex);
label = fillPattern(labelText, labelReplaceInfo, trip.timeRange[vm.index]);
label = fillPattern(labelText, labelReplaceInfo, calculateCurrentDate(trip.timeRange, vm.index));
if (vm.staticSettings.useLabelFunction && angular.isDefined(vm.staticSettings.labelFunction)) {
try {
labelText = vm.staticSettings.labelFunction(vm.ctx.data, trip.timeRange[vm.index], trip.dSIndex);
labelText = vm.staticSettings.labelFunction(vm.ctx.data, calculateCurrentDate(trip.timeRange, vm.index), trip.dSIndex);
} catch (e) {
labelText = null;
}
@ -504,14 +500,14 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
let tooltipText = vm.staticSettings.tooltipPattern;
if (vm.staticSettings.useTooltipFunction && angular.isDefined(vm.staticSettings.tooltipFunction)) {
try {
tooltipText = vm.staticSettings.tooltipFunction(vm.ctx.data, trip.timeRange[vm.index], trip.dSIndex);
tooltipText = vm.staticSettings.tooltipFunction(vm.ctx.data, calculateCurrentDate(trip.timeRange, vm.index), trip.dSIndex);
} catch (e) {
tooltipText = null;
}
}
tooltipText = vm.utils.createLabelFromDatasource(trip.dataSource, tooltipText);
tooltipReplaceInfo = processPattern(tooltipText, vm.ctx.datasources, trip.dSIndex);
tooltip = fillPattern(tooltipText, tooltipReplaceInfo, trip.timeRange[vm.index]);
tooltip = fillPattern(tooltipText, tooltipReplaceInfo, calculateCurrentDate(trip.timeRange, vm.index));
tooltip = fillPatternWithActions(tooltip, 'onTooltipAction', null);
}
@ -525,14 +521,14 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
let tooltipText = vm.staticSettings.polygonTooltipPattern;
if (vm.staticSettings.usePolygonTooltipFunction && angular.isDefined(vm.staticSettings.polygonTooltipFunction)) {
try {
tooltipText = vm.staticSettings.polygonTooltipFunction(vm.ctx.data, trip.timeRange[vm.index], trip.dSIndex);
tooltipText = vm.staticSettings.polygonTooltipFunction(vm.ctx.data, calculateCurrentDate(trip.timeRange, vm.index), trip.dSIndex);
} catch (e) {
tooltipText = null;
}
}
tooltipText = vm.utils.createLabelFromDatasource(trip.dataSource, tooltipText);
tooltipReplaceInfo = processPattern(tooltipText, vm.ctx.datasources, trip.dSIndex);
tooltip = fillPattern(tooltipText, tooltipReplaceInfo, trip.timeRange[vm.index]);
tooltip = fillPattern(tooltipText, tooltipReplaceInfo, calculateCurrentDate(trip.timeRange, vm.index));
tooltip = fillPatternWithActions(tooltip, 'onTooltipAction', null);
}
@ -546,14 +542,14 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
let tooltipText = vm.staticSettings.tooltipPattern;
if (vm.staticSettings.useTooltipFunction && angular.isDefined(vm.staticSettings.tooltipFunction)) {
try {
tooltipText = vm.staticSettings.tooltipFunction(vm.ctx.data, trip.timeRange[index], trip.dSIndex);
tooltipText = vm.staticSettings.tooltipFunction(vm.ctx.data, calculateCurrentDate(trip.timeRange, index), trip.dSIndex);
} catch (e) {
tooltipText = null;
}
}
tooltipText = vm.utils.createLabelFromDatasource(trip.dataSource, tooltipText);
tooltipReplaceInfo = processPattern(tooltipText, vm.ctx.datasources, trip.dSIndex);
tooltip = fillPattern(tooltipText, tooltipReplaceInfo, trip.timeRange[index]);
tooltip = fillPattern(tooltipText, tooltipReplaceInfo, calculateCurrentDate(trip.timeRange, index));
tooltip = fillPatternWithActions(tooltip, 'onTooltipAction', null);
}
@ -565,7 +561,7 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
let colorFn;
if (vm.staticSettings.usePathColorFunction && angular.isDefined(vm.staticSettings.colorFunction)) {
try {
colorFn = vm.staticSettings.colorFunction(vm.ctx.data, trip.timeRange[vm.index], trip.dSIndex);
colorFn = vm.staticSettings.colorFunction(vm.ctx.data, calculateCurrentDate(trip.timeRange, vm.index), trip.dSIndex);
} catch (e) {
colorFn = null;
}
@ -581,7 +577,7 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
let colorFn;
if (vm.staticSettings.usePolygonColorFunction && angular.isDefined(vm.staticSettings.polygonColorFunction)) {
try {
colorFn = vm.staticSettings.polygonColorFunction(vm.ctx.data, trip.timeRange[vm.index], trip.dSIndex);
colorFn = vm.staticSettings.polygonColorFunction(vm.ctx.data, calculateCurrentDate(trip.timeRange, vm.index), trip.dSIndex);
} catch (e) {
colorFn = null;
}
@ -597,7 +593,7 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
if (vm.staticSettings.useMarkerImageFunction && angular.isDefined(vm.staticSettings.markerImageFunction)) {
let rawIcon;
try {
rawIcon = vm.staticSettings.markerImageFunction(vm.ctx.data, vm.staticSettings.markerImages, trip.timeRange[vm.index], trip.dSIndex);
rawIcon = vm.staticSettings.markerImageFunction(vm.ctx.data, vm.staticSettings.markerImages, calculateCurrentDate(trip.timeRange, vm.index), trip.dSIndex);
} catch (e) {
rawIcon = null;
}
@ -658,8 +654,8 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
});
vm.initBounds = true;
}
let normalizedTimeRange = createNormalizedTime(vm.data, vm.staticSettings.normalizationStep);
createNormalizedTrips(normalizedTimeRange, vm.datasources);
createNormalizedTime(vm.data, vm.staticSettings.normalizationStep);
createNormalizedTrips(vm.datasources, vm.data, vm.staticSettings.normalizationStep);
createTripsOnMap(apply);
if (vm.initBounds && !vm.initTrips) {
vm.trips.forEach(function (trip) {
@ -701,127 +697,82 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
function createNormalizedTime(data, step) {
if (!step) step = 1000;
let max_time = null;
let min_time = null;
let normalizedArray = [];
if (data && data.length > 0) {
vm.data.forEach(function (data) {
if (data.data.length > 0) {
data.data.forEach(function (sData) {
if (max_time === null) {
max_time = sData[0];
} else if (max_time < sData[0]) {
max_time = sData[0]
}
if (min_time === null) {
min_time = sData[0];
} else if (min_time > sData[0]) {
min_time = sData[0];
}
})
let max_time = -Infinity;
let min_time = Infinity;
if (data) {
for (let i = 0; i < data.length; i++) {
for (let j = 0; j < data[i].data.length; j++) {
if (max_time < data[i].data[j][0]) {
max_time = data[i].data[j][0]
}
if (min_time > data[i].data[j][0]) {
min_time = data[i].data[j][0];
}
}
});
for (let i = min_time; i < max_time; i += step) {
normalizedArray.push({ts: i, formattedTs: $filter('date')(i, 'medium')});
}
if (normalizedArray[normalizedArray.length - 1] && normalizedArray[normalizedArray.length - 1].ts !== max_time) {
normalizedArray.push({ts: max_time, formattedTs: $filter('date')(max_time, 'medium')});
}
}
vm.maxTime = normalizedArray.length - 1;
//vm.minTime = vm.maxTime > 1 ? 1 : 0;
if (vm.index < vm.minTime) {
vm.index = vm.minTime;
} else if (vm.index > vm.maxTime) {
vm.index = vm.maxTime;
vm.minTime = vm.animationTime = min_time;
if(min_time === Infinity){
vm.animationTime = null;
} else {
vm.animationTime = min_time
}
vm.maxTimeIndex = Math.ceil((max_time - min_time) / step);
if (vm.index < vm.minTimeIndex) {
vm.index = vm.minTimeIndex;
} else if (vm.index > vm.maxTimeIndex) {
vm.index = vm.maxTimeIndex;
}
return normalizedArray;
}
function createNormalizedTrips(timeRange, dataSources) {
function createNormalizedTrips(dataSources, data, step) {
vm.trips = [];
if (timeRange && timeRange.length > 0 && dataSources && dataSources.length > 0 && vm.data && vm.data.length > 0) {
dataSources.forEach(function (dS, index) {
step = step || 1000;
if (dataSources && data) {
for (let i = 0; i < dataSources.length; i++) {
vm.trips.push({
dataSource: dS,
dSIndex: index,
timeRange: angular.copy(timeRange)
dataSource: dataSources[i],
dSIndex: i,
timeRange: {}
})
});
}
vm.data.forEach(function (data) {
let ds = data.datasource;
for (let i = 0; i < data.length; i++) {
let ds = data[i].datasource;
let tripIndex = vm.trips.findIndex(function (el) {
return el.dataSource.entityId === ds.entityId;
});
if (tripIndex > -1) {
createNormalizedValue(data.data, data.dataKey.label, vm.trips[tripIndex].timeRange);
createNormalizedValue(data[i].data, data[i].dataKey.label, vm.trips[tripIndex].timeRange, step);
}
})
}
}
createNormalizedLatLngs();
}
function createNormalizedValue(dataArray, dataKey, timeRangeArray) {
timeRangeArray.forEach(function (timeStamp) {
let targetTDiff = null;
let value = null;
for (let i = 0; i < dataArray.length; i++) {
let tDiff = dataArray[i][0] - timeStamp.ts;
if (targetTDiff === null || (tDiff <= 0 && targetTDiff < tDiff)) {
targetTDiff = tDiff;
value = dataArray[i][1];
}
}
if (value !== null) timeStamp[dataKey] = value;
});
function createNormalizedValue(dataArray, dataKey, timeRange, step) {
for (let i = 0; i < dataArray.length; i++) {
let normalizeTime = vm.minTime + Math.ceil((dataArray[i][0] - vm.minTime) / step) * step;
timeRange[normalizeTime] = timeRange[normalizeTime] || {};
timeRange[normalizeTime][dataKey] = dataArray[i][1];
}
}
function createNormalizedLatLngs() {
vm.trips.forEach(function (el) {
el.latLngs = [];
el.timeRange.forEach(function (data) {
let lat = data[vm.staticSettings.latKeyName];
let lng = data[vm.staticSettings.lngKeyName];
if (lat && lng && vm.map) {
data.latLng = vm.map.createLatLng(lat, lng);
}
el.latLngs.push(data.latLng);
});
addAngleForTrip(el);
})
}
function addAngleForTrip(trip) {
if (trip.timeRange && trip.timeRange.length > 0) {
trip.timeRange.forEach(function (point, index) {
let nextPoint, prevPoint;
nextPoint = index === (trip.timeRange.length - 1) ? trip.timeRange[index] : trip.timeRange[index + 1];
prevPoint = index === 0 ? trip.timeRange[0] : trip.timeRange[index - 1];
let nextLatLng = {
lat: nextPoint[vm.staticSettings.latKeyName],
lng: nextPoint[vm.staticSettings.lngKeyName]
};
let prevLatLng = {
lat: prevPoint[vm.staticSettings.latKeyName],
lng: prevPoint[vm.staticSettings.lngKeyName]
};
if (nextLatLng.lat === prevLatLng.lat && nextLatLng.lng === prevLatLng.lng) {
if (angular.isNumber(prevPoint.h)) {
point.h = prevPoint.h;
} else {
point.h = vm.staticSettings.rotationAngle;
vm.trips.forEach(function (item) {
item.latLngs = [];
for (let timestamp in item.timeRange) {
if(Object.prototype.hasOwnProperty.call(item.timeRange, timestamp)) {
let lat = item.timeRange[timestamp][vm.staticSettings.latKeyName];
let lng = item.timeRange[timestamp][vm.staticSettings.lngKeyName];
if (lat && lng && vm.map) {
item.timeRange[timestamp].latLng = vm.map.createLatLng(lat, lng);
}
} else {
point.h = findAngle(prevLatLng.lat, prevLatLng.lng, nextLatLng.lat, nextLatLng.lng);
point.h += vm.staticSettings.rotationAngle;
item.latLngs.push(item.timeRange[timestamp].latLng);
}
});
}
}
});
}
function createPointPopup(point, index, trip) {
@ -834,14 +785,14 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
function createTripsOnMap(apply) {
if (vm.trips.length > 0) {
vm.trips.forEach(function (trip) {
configureTripSettings(trip, vm.index, apply);
if (trip.timeRange.length > 0 && trip.latLngs.every(el => angular.isDefined(el))) {
configureTripSettings(trip, apply);
if (Object.keys(trip.timeRange).length > 0 && trip.latLngs.every(el => angular.isDefined(el))) {
if (vm.staticSettings.showPoints) {
trip.points = [];
trip.timeRange.forEach(function (tRange, index) {
if (tRange && tRange.latLng
&& (!vm.staticSettings.usePointAsAnchor || vm.staticSettings.pointAsAnchorFunction(vm.ctx.data, tRange, trip.dSIndex))) {
let point = L.circleMarker(tRange.latLng, {
Object.keys(trip.timeRange).forEach(function (tRange, index) {
if (trip.timeRange[tRange] && trip.timeRange[tRange].latLng
&& (!vm.staticSettings.usePointAsAnchor || vm.staticSettings.pointAsAnchorFunction(vm.ctx.data, trip.timeRange[tRange], trip.dSIndex))) {
let point = L.circleMarker(trip.timeRange[tRange].latLng, {
color: trip.settings.pointColor,
radius: trip.settings.pointSize
}).addTo(vm.map.map);
@ -852,7 +803,7 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
showHidePointTooltip(calculatePointTooltip(trip, index), index);
});
}
if (vm.staticSettings.usePointAsAnchor) tRange.hasAnchor = true;
if (vm.staticSettings.usePointAsAnchor) trip.timeRange[tRange].hasAnchor = true;
trip.points.push(point);
}
});
@ -872,7 +823,8 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
polygon: false,
pathOptions: {
color: vm.staticSettings.useDecoratorCustomColor ? vm.staticSettings.decoratorCustomColor : trip.settings.color,
stroke: true}
stroke: true
}
})
}
],
@ -882,8 +834,8 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
}
if (trip.timeRange && trip.timeRange.length && angular.isUndefined(trip.marker)) {
trip.marker = L.marker(trip.timeRange[vm.index].latLng);
if (trip.timeRange && Object.keys(trip.timeRange).length && angular.isUndefined(trip.marker)) {
trip.marker = L.marker(calculateCurrentDate(trip.timeRange, vm.index).latLng);
trip.marker.setZIndexOffset(1000);
trip.marker.setIcon(vm.staticSettings.icon);
trip.marker.setRotationOrigin('center center');
@ -895,7 +847,7 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
}
}
if (vm.staticSettings.showPolygon && angular.isDefined(trip.timeRange[vm.index][vm.staticSettings.polKeyName])) {
if (vm.staticSettings.showPolygon && angular.isDefined(calculateCurrentDate(trip.timeRange, vm.index)[vm.staticSettings.polKeyName])) {
let polygonSettings = {
fill: true,
fillColor: trip.settings.polygonColor,
@ -904,7 +856,7 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
fillOpacity: trip.settings.polygonOpacity,
opacity: trip.settings.polygonStrokeOpacity
};
let polygonLatLngsRaw = mapPolygonArray(angular.fromJson(trip.timeRange[vm.index][vm.staticSettings.polKeyName]));
let polygonLatLngsRaw = mapPolygonArray(angular.fromJson(calculateCurrentDate(trip.timeRange, vm.index)[vm.staticSettings.polKeyName]));
trip.polygon = L.polygon(polygonLatLngsRaw, polygonSettings).addTo(vm.map.map);
trip.polygon.on('click',function(){showHidePolygonTooltip(trip)});
}
@ -912,6 +864,35 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
}
}
function calculateCurrentDate(tripTimeRange, index) {
let time = vm.minTime + index * vm.staticSettings.normalizationStep;
if (Object.hasOwnProperty.call(tripTimeRange, time)) {
return tripTimeRange[time];
} else {
let timeInterval = Object.keys(tripTimeRange);
for (let i = 1; i < timeInterval.length; i++) {
if (timeInterval[i - 1] < time && timeInterval[i] > time) {
let calcPosition = angular.copy(tripTimeRange[timeInterval[i - 1]]);
let startLatLng = tripTimeRange[timeInterval[i - 1]].latLng;
let finishLatLng = tripTimeRange[timeInterval[i]].latLng;
let percentRouteComplete = (time - timeInterval[i - 1]) / (timeInterval[i] - timeInterval[i - 1]);
calcPosition[vm.staticSettings.latKeyName] = startLatLng.lat + (finishLatLng.lat - startLatLng.lat) * percentRouteComplete;
calcPosition[vm.staticSettings.lngKeyName] = startLatLng.lng + (finishLatLng.lng - startLatLng.lng) * percentRouteComplete;
calcPosition.latLng = vm.map.createLatLng(calcPosition[vm.staticSettings.latKeyName], calcPosition[vm.staticSettings.lngKeyName]);
calcPosition.angle = vm.staticSettings.rotationAngle + findAngle(startLatLng, finishLatLng);
return calcPosition;
}
}
}
return {};
}
function findAngle(startPoint, endPoint) {
let angle = -Math.atan2(endPoint.lat - startPoint.lat, endPoint.lng - startPoint.lng);
angle = angle * 180 / Math.PI;
return parseInt(angle.toFixed(2));
}
function mapPolygonArray(rawArray) {
return rawArray.map(function (el) {
if (el.length === 2) {
@ -931,15 +912,16 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
}
function moveMarker(trip) {
if (angular.isDefined(trip.timeRange[vm.index].latLng)) {
let postionMarker = calculateCurrentDate(trip.timeRange, vm.index);
if (angular.isDefined(postionMarker)) {
if (angular.isDefined(trip.marker)) {
trip.markerAngleIsSet = true;
trip.marker.setLatLng(trip.timeRange[vm.index].latLng);
trip.marker.setRotationAngle(trip.timeRange[vm.index].h);
trip.marker.setLatLng(postionMarker.latLng);
trip.marker.setRotationAngle(postionMarker.angle);
trip.marker.update();
} else {
if (trip.timeRange && trip.timeRange.length) {
trip.marker = L.marker(trip.timeRange[vm.index].latLng);
trip.marker = L.marker(postionMarker.latLng);
trip.marker.setZIndexOffset(1000);
trip.marker.setIcon(vm.staticSettings.icon);
trip.marker.setRotationOrigin('center center');
@ -1000,4 +982,4 @@ function tripAnimationController($document, $scope, $log, $http, $timeout, $filt
if (trip && vm.activeTripIndex !== trip.dSIndex) vm.activeTripIndex = trip.dSIndex;
vm.mainTooltip = vm.trips[vm.activeTripIndex].settings.polygonTooltipText;
}
}
}

12
ui/src/app/widget/lib/tripAnimation/trip-animation-widget.tpl.html
View File

@ -27,8 +27,10 @@
<ng-md-icon icon="info_outline"></ng-md-icon>
</md-button>
</div>
<div class="trip-animation-tooltip md-whiteframe-z4" layout="column" ng-class="!vm.staticSettings.showTooltip ? 'trip-animation-tooltip-hidden':''" ng-bind-html="vm.mainTooltip"
ng-style="{'background-color': vm.staticSettings.tooltipColor, 'opacity': vm.staticSettings.tooltipOpacity, 'color': vm.staticSettings.tooltipFontColor}">
<div class="trip-animation-tooltip md-whiteframe-z4" layout="column"
ng-class="!vm.staticSettings.showTooltip ? 'trip-animation-tooltip-hidden':''"
ng-bind-html="vm.mainTooltip"
ng-style="{'background-color': vm.staticSettings.tooltipColor, 'opacity': vm.staticSettings.tooltipOpacity, 'color': vm.staticSettings.tooltipFontColor}">
</div>
</div>
<div class="trip-animation-control-panel">
@ -39,7 +41,7 @@
<md-button class="md-icon-button" aria-label="Previous" ng-click="vm.movePrev()">
<md-icon class="material-icons" ng-style="{'color': vm.staticSettings.buttonColor}">skip_previous</md-icon>
</md-button>
<md-slider ng-model="vm.index" min="{{vm.minTime}}" max="{{vm.maxTime}}" ng-change="vm.recalculateTrips()"></md-slider>
<md-slider ng-model="vm.index" min="{{vm.minTimeIndex}}" max="{{vm.maxTimeIndex}}" ng-change="vm.recalculateTrips()"></md-slider>
<md-button class="md-icon-button" aria-label="Next" ng-click="vm.moveNext()">
<md-icon class="material-icons" ng-style="{'color': vm.staticSettings.buttonColor}">skip_next</md-icon>
</md-button>
@ -61,7 +63,9 @@
</md-icon>
</md-button>
</md-slider-container>
<div class="panel-timer">{{vm.trips[vm.activeTripIndex].timeRange[vm.index].ts | date:'medium'}}
<div class="panel-timer">
<span ng-show="vm.animationTime">{{ vm.animationTime | date:'medium'}}</span>
<span ng-hide="vm.animationTime">{{ "widget.no-data" | translate}}</span>
</div>
</div>
</div>

Write Preview
Loading…
Cancel
Save