286 lines
10 KiB
JavaScript
286 lines
10 KiB
JavaScript
import { createSeriesModel, createMarkLineModels, createRectArea, createMartPoint } from './utils';
|
|
import { toTimeStamp } from '@/utils/date';
|
|
|
|
export default {
|
|
/** 最小时间*/
|
|
MinTime: 0,
|
|
|
|
/** 最大时间*/
|
|
MaxTime: 3600 * 24 - 1,
|
|
|
|
/** 边缘高度*/
|
|
EdgeHeight: 600,
|
|
|
|
/** 间隔高度*/
|
|
CoordMultiple: 1,
|
|
|
|
/** 偏移时间*/
|
|
TranslationTime: 0,
|
|
|
|
/** 转换model为Rect数据*/
|
|
calcAreaArgsByModel(chart, model) {
|
|
const fartherKmRange = model.fartherKmRange;
|
|
const closerKmRange = model.closerKmRange;
|
|
const startTime = model.startTime;
|
|
const endTime = model.endTime;
|
|
const point1 = [startTime, this.getCoordinateYByKmRange(fartherKmRange)];
|
|
const point2 = [endTime, this.getCoordinateYByKmRange(closerKmRange)];
|
|
const position1 = chart.convertToPixel('grid', point1);
|
|
const position2 = chart.convertToPixel('grid', point2);
|
|
const position = position1;
|
|
const width = Math.abs(position1[0] - position2[0]);
|
|
const height = Math.abs(position1[1] - position2[1]);
|
|
|
|
return {
|
|
model,
|
|
position,
|
|
point1,
|
|
point2,
|
|
width,
|
|
height
|
|
};
|
|
},
|
|
|
|
/** 将后台数据解析成图形*/
|
|
parseDataToGraph(chart, planData) {
|
|
const graphs = [];
|
|
if (planData &&
|
|
planData.areaList &&
|
|
planData.areaList.length) {
|
|
planData.areaList.forEach(model => {
|
|
if (typeof model.startTime == 'string') model.startTime = toTimeStamp(model.startTime);
|
|
if (typeof model.endTime == 'string') model.endTime = toTimeStamp(model.endTime);
|
|
graphs.push(createRectArea(this.calcAreaArgsByModel(chart, model)));
|
|
});
|
|
}
|
|
|
|
return graphs;
|
|
},
|
|
|
|
/** 将后台数据解析成折线*/
|
|
parseDataToSeries(chart, planData, stations) {
|
|
const models = [];
|
|
if (planData &&
|
|
planData.serviceList &&
|
|
planData.serviceList.length) {
|
|
planData.serviceList.forEach((service, i) => {
|
|
if (service.tripList &&
|
|
service.tripList.length) {
|
|
|
|
const opt = {
|
|
name: `service${service.serviceNo}`,
|
|
type: 'line',
|
|
symbolSize: 1,
|
|
showAllSymbol: true,
|
|
markPoint: { data: [] },
|
|
data: []
|
|
};
|
|
|
|
service.tripList.forEach((trip, j) => {
|
|
var lastPoint = null;
|
|
var nextPoint = null;
|
|
var pointData = {
|
|
name: `${service.serviceNo}-${trip.tripNo}`,
|
|
color: '#000',
|
|
direction: trip.direction,
|
|
coord: [trip.stationTimeList[0].departureTime, this.getCoordinateYByStationId(stations, trip.stationTimeList[0].stationId)]
|
|
};
|
|
|
|
opt.markPoint.data.push(createMartPoint(pointData));
|
|
|
|
trip.stationTimeList.forEach(elem => {
|
|
if (elem.arrivalTime) {
|
|
opt.data.push([elem.arrivalTime, this.getCoordinateYByStationId(stations, elem.stationId), {
|
|
stationId: elem.stationId,
|
|
serviceNo: service.serviceNo,
|
|
tripNo: trip.tripNo,
|
|
direction: trip.direction,
|
|
silent: false
|
|
}]);
|
|
}
|
|
|
|
if (elem.departureTime) {
|
|
opt.data.push([elem.departureTime, this.getCoordinateYByStationId(stations, elem.stationId), {
|
|
stationId: elem.stationId,
|
|
serviceNo: service.serviceNo,
|
|
tripNo: trip.tripNo,
|
|
direction: trip.direction,
|
|
silent: false
|
|
}]);
|
|
}
|
|
});
|
|
|
|
if (service.tripList[j + 1] &&
|
|
service.tripList[j + 1].stationTimeList) {
|
|
|
|
lastPoint = trip.stationTimeList[trip.stationTimeList.length - 1];
|
|
nextPoint = service.tripList[j + 1].stationTimeList[0];
|
|
|
|
opt.data.push({
|
|
value: [lastPoint.arrivalTime, this.getCoordinateYByStationId(stations, lastPoint.stationId, true, trip.direction), {
|
|
stationId: lastPoint.stationId,
|
|
serviceNo: service.serviceNo,
|
|
tripNo: trip.tripNo,
|
|
direction: trip.direction,
|
|
silent: true
|
|
}],
|
|
symbol: 'none',
|
|
symbolSize: 1
|
|
});
|
|
opt.data.push({
|
|
value: [nextPoint.departureTime, this.getCoordinateYByStationId(stations, lastPoint.stationId, true, trip.direction), {
|
|
stationId: lastPoint.stationId,
|
|
serviceNo: service.serviceNo,
|
|
tripNo: trip.tripNo,
|
|
direction: trip.direction,
|
|
silent: true
|
|
}],
|
|
symbol: 'none',
|
|
symbolSize: 1
|
|
});
|
|
}
|
|
});
|
|
|
|
const model = createSeriesModel(opt,
|
|
{ color: '#000', width: 1 },
|
|
{ color: '#000', fill: '#000'}
|
|
);
|
|
models.push(model);
|
|
}
|
|
});
|
|
}
|
|
|
|
return models;
|
|
},
|
|
|
|
/** 更新数据并解析成折线*/
|
|
updateDataToModels(chart, planData, stations, series) {
|
|
if (planData && planData.length) {
|
|
}
|
|
return series;
|
|
},
|
|
|
|
/** 初始化Y轴*/
|
|
initializeYaxis(stations) {
|
|
return createMarkLineModels(stations, (elem) => {
|
|
return elem.kmRange * this.CoordMultiple;
|
|
});
|
|
},
|
|
|
|
/** 计算y轴最小值*/
|
|
computedYaxisMinValue(stations) {
|
|
return stations[0].kmRange * this.CoordMultiple - this.EdgeHeight;
|
|
},
|
|
|
|
/** 计算y轴最大值*/
|
|
computedYaxisMaxValue(stations) {
|
|
return stations[stations.length - 1].kmRange * this.CoordMultiple + this.EdgeHeight;
|
|
},
|
|
|
|
/** 格式化y轴数据*/
|
|
computedFormatYAxis(stations, params) {
|
|
var yText = '0m';
|
|
|
|
stations.forEach(elem => {
|
|
if (elem.kmRange < parseInt(params.value) / this.CoordMultiple) {
|
|
yText = Math.floor(elem.kmRange) + 'm';
|
|
}
|
|
});
|
|
|
|
return yText;
|
|
},
|
|
|
|
/** 根据方向计算y折返偏移量*/
|
|
getOffsetY(isSpecial, direction) {
|
|
if (isSpecial) {
|
|
if (direction === '1') {
|
|
return -this.EdgeHeight / 2;
|
|
} else if (direction === '2') {
|
|
return +this.EdgeHeight / 2;
|
|
}
|
|
}
|
|
|
|
return 0;
|
|
},
|
|
|
|
/** 通过y坐标获取车站公里表*/
|
|
getKmRangeByCoordinateY(y) {
|
|
return parseInt(y / this.CoordMultiple);
|
|
},
|
|
|
|
/** 通过公里表获取坐标值*/
|
|
getCoordinateYByKmRange(k) {
|
|
return k * this.CoordMultiple;
|
|
},
|
|
|
|
/** 通过站信息获取y坐标*/
|
|
getCoordinateYByStationId(stations, stationId, isSpecial = false, direction = '01') {
|
|
var value = 0;
|
|
var station = stations.find(it => { return it.id == stationId; });
|
|
if (station) {
|
|
value = this.getCoordinateYByKmRange(station.kmRange) + this.getOffsetY(isSpecial, direction);
|
|
}
|
|
|
|
return value;
|
|
},
|
|
|
|
/** 通过y坐标获取站信息 */
|
|
getStationByCoordinateY(stations, y) {
|
|
for (var i = stations.length - 1; i >= 0; i--) {
|
|
const station = stations[i];
|
|
const edge = this.EdgeHeight / 2;
|
|
const preKm = i == 0 ? edge * 2 : Math.abs(station.kmRange - stations[i - 1].kmRange) / 2;
|
|
const nxtKm = i == stations.length - 1 ? edge : Math.abs(station.kmRange - stations[i + 1].kmRange) / 2;
|
|
const min = edge + station.kmRange - preKm;
|
|
const max = edge + station.kmRange + nxtKm;
|
|
if (y >= min && y <= max) {
|
|
return station;
|
|
}
|
|
}
|
|
return null;
|
|
},
|
|
|
|
/** 限制区域范围 */
|
|
limitAreaTime(model) {
|
|
if (model) {
|
|
model.startTime = model.startTime < this.MinTime
|
|
? this.MinTime
|
|
: model.startTime > this.MaxTime
|
|
? this.MaxTime
|
|
: model.startTime;
|
|
|
|
model.endTime = model.endTime < this.MinTime
|
|
? this.MinTime
|
|
: model.endTime > this.MaxTime
|
|
? this.MaxTime
|
|
: model.endTime;
|
|
}
|
|
return model;
|
|
},
|
|
|
|
/** 检查公里表是否超出范围*/
|
|
limitAreaKmRange(stations, model) {
|
|
const closerKmRange = model.closerKmRange;
|
|
const fartherKmRange = model.fartherKmRange;
|
|
const length = stations.length;
|
|
const first = stations[0] || {};
|
|
const last = stations[length - 1] || {};
|
|
const minRange = first.kmRange - this.EdgeHeight;
|
|
const maxRange = last.kmRange;
|
|
const tolerant = 0;
|
|
|
|
if (closerKmRange < minRange - tolerant) {
|
|
const offset = closerKmRange - minRange;
|
|
model.closerKmRange = minRange;
|
|
model.fartherKmRange -= offset;
|
|
return true;
|
|
} else if (fartherKmRange > maxRange + tolerant) {
|
|
const offset = fartherKmRange - maxRange;
|
|
model.fartherKmRange = maxRange;
|
|
model.closerKmRange -= offset;
|
|
return true;
|
|
}
|
|
return false;
|
|
}
|
|
};
|