增加车次号标签
This commit is contained in:
lVAL
parent
d3ea1cd22e
commit
2fadaade87
@ -1,4 +1,4 @@
|
||||
import { createMartPointReverse, createSeriesModel, createMarkLineModels, hexColor, convertSheetToList, prefixTime } from '@/utils/runPlan';
|
||||
import { createSeriesModel, createMarkLineModels, createMartPoint } from './utils';
|
||||
import { toTimeStamp } from '@/utils/date';
|
||||
|
||||
export default {
|
||||
@ -12,17 +12,17 @@ export default {
|
||||
TranslationTime: 0,
|
||||
|
||||
/** 将后台数据解析成图形*/
|
||||
parseDataToGraph(chart, planData, stations, kmRangeCoordMap) {
|
||||
parseDataToGraph(chart, planData, stations, kmRangeCoordinateMap) {
|
||||
const graphs = [];
|
||||
if (planData &&
|
||||
planData.areaList &&
|
||||
planData.areaList.length) {
|
||||
planData.areaList.forEach(el => {
|
||||
const startTime = toTimeStamp(el.startTime);
|
||||
const endTime = toTimeStamp(el.endTime);
|
||||
planData.areaList.forEach(area => {
|
||||
const startTime = toTimeStamp(area.startTime);
|
||||
const endTime = toTimeStamp(area.endTime);
|
||||
|
||||
const fartherKm = this.getCoordYByObj(stations, kmRangeCoordMap, {stationCode: el.fartherStationCode});
|
||||
const closerKm = this.getCoordYByObj(stations, kmRangeCoordMap, {stationCode: el.closerStationCode});
|
||||
const fartherKm = this.getCoordinateYByObj(stations, kmRangeCoordinateMap, {stationCode: area.fartherStationCode});
|
||||
const closerKm = this.getCoordinateYByObj(stations, kmRangeCoordinateMap, {stationCode: area.closerStationCode});
|
||||
const point1 = [ startTime, fartherKm];
|
||||
const point2 = [ endTime, closerKm]
|
||||
const position = chart.convertToPixel('grid', point1);
|
||||
@ -33,11 +33,11 @@ export default {
|
||||
graphs.push({
|
||||
type: 'rect',
|
||||
subType: 'Area',
|
||||
areaNo: el.areaNo,
|
||||
areaNo: area.areaNo,
|
||||
position,
|
||||
point1,
|
||||
point2,
|
||||
model: el,
|
||||
model: area,
|
||||
shape: {
|
||||
x: 0,
|
||||
y: 0,
|
||||
@ -57,64 +57,127 @@ export default {
|
||||
},
|
||||
|
||||
/** 将后台数据解析成折线*/
|
||||
parseDataToSeries(chart, planData, stations, kmRangeCoordMap) {
|
||||
parseDataToSeries(chart, planData, stations, kmRangeCoordinateMap) {
|
||||
const models = [];
|
||||
if (planData &&
|
||||
planData.serviceList &&
|
||||
planData.serviceList.length) {
|
||||
planData.serviceList.forEach(el => {
|
||||
if (el.tripList &&
|
||||
el.tripList.length) {
|
||||
el.tripList.forEach(trip => {
|
||||
planData.serviceList.forEach((service,i) => {
|
||||
if (service.tripList &&
|
||||
service.tripList.length) {
|
||||
|
||||
service.tripList.forEach((trip,j) => {
|
||||
const opt = {
|
||||
name: `plan-${el.serviceNo}-${trip.tripNo}-${trip.direction}`,
|
||||
name: `plan-${service.serviceNo}-${trip.tripNo}-${trip.direction}`,
|
||||
type: 'line',
|
||||
symbolSize: 1,
|
||||
showAllSymbol: true,
|
||||
lineStyle: {
|
||||
color: '#000',
|
||||
width: 1,
|
||||
},
|
||||
itemStyle: {
|
||||
color: '#000',
|
||||
fill: '#000'
|
||||
},
|
||||
markPoint: { data: [] },
|
||||
data: []
|
||||
};
|
||||
|
||||
trip.stationTimeList.forEach((elem,idx) => {
|
||||
var lastPoint = null;
|
||||
var nextPoint = null;
|
||||
var pointData = {
|
||||
name: `${service.serviceNo}-${trip.tripNo}`,
|
||||
color: '#000',
|
||||
direction: trip.direction,
|
||||
coord: [trip.stationTimeList[0].departureTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, trip.stationTimeList[0], trip.direction, false)],
|
||||
};
|
||||
|
||||
opt.markPoint.data.push(createMartPoint(pointData));
|
||||
|
||||
trip.stationTimeList.forEach(elem => {
|
||||
const name = `${trip.direction}${trip.tripNo}`;
|
||||
if (elem.arrivalTime) {
|
||||
opt.data.push([elem.arrivalTime, this.getCoordYByObj(stations, kmRangeCoordMap, elem), {
|
||||
opt.data.push([elem.arrivalTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, elem, elem.direction, false), {
|
||||
stationCode: elem.stationCode,
|
||||
serviceNo: el.serviceNo,
|
||||
serviceNo: service.serviceNo,
|
||||
tripNo: trip.tripNo,
|
||||
direction: trip.direction,
|
||||
name
|
||||
}]);
|
||||
}
|
||||
|
||||
if (elem.departureTime) {
|
||||
opt.data.push([elem.departureTime, this.getCoordYByObj(stations, kmRangeCoordMap, elem), {
|
||||
opt.data.push([elem.departureTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, elem, elem.direction, false), {
|
||||
stationCode: elem.stationCode,
|
||||
serviceNo: el.serviceNo,
|
||||
serviceNo: service.serviceNo,
|
||||
tripNo: trip.tripNo,
|
||||
direction: trip.direction,
|
||||
name
|
||||
}]);
|
||||
}
|
||||
});
|
||||
|
||||
models.push(opt);
|
||||
});
|
||||
const model = createSeriesModel(opt,
|
||||
{ color: '#000', width: 1 },
|
||||
{ color: '#000', fill: '#000'}
|
||||
);
|
||||
models.push(model);
|
||||
|
||||
if (service.tripList[j + 1] &&
|
||||
service.tripList[j + 1].stationTimeList) {
|
||||
const opt = {
|
||||
name: `reentry-${service.serviceNo}-${trip.tripNo}-${trip.direction}`,
|
||||
type: 'line',
|
||||
symbolSize: 1,
|
||||
showAllSymbol: false,
|
||||
markPoint: { data: [] },
|
||||
data: []
|
||||
};
|
||||
|
||||
lastPoint = trip.stationTimeList[trip.stationTimeList.length-1];
|
||||
nextPoint = service.tripList[j + 1].stationTimeList[0];
|
||||
const name = `${trip.direction}${trip.tripNo}`;
|
||||
opt.data.push([lastPoint.arrivalTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, lastPoint, trip.direction, false), {
|
||||
stationCode: lastPoint.stationCode,
|
||||
serviceNo: service.serviceNo,
|
||||
tripNo: trip.tripNo,
|
||||
direction: trip.direction,
|
||||
name
|
||||
}]);
|
||||
|
||||
opt.data.push([lastPoint.arrivalTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, lastPoint, trip.direction, true), {
|
||||
stationCode: lastPoint.stationCode,
|
||||
serviceNo: service.serviceNo,
|
||||
tripNo: trip.tripNo,
|
||||
direction: trip.direction,
|
||||
name
|
||||
}]);
|
||||
opt.data.push([nextPoint.departureTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, lastPoint, trip.direction, true), {
|
||||
stationCode: lastPoint.stationCode,
|
||||
serviceNo: service.serviceNo,
|
||||
tripNo: trip.tripNo,
|
||||
direction: trip.direction,
|
||||
name
|
||||
}]);
|
||||
opt.data.push([nextPoint.departureTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, lastPoint, trip.direction, false), {
|
||||
stationCode: lastPoint.stationCode,
|
||||
serviceNo: service.serviceNo,
|
||||
tripNo: trip.tripNo,
|
||||
direction: trip.direction,
|
||||
name
|
||||
}]);
|
||||
|
||||
|
||||
const model = createSeriesModel(opt,
|
||||
{ color: '#000', width: 1 },
|
||||
{ color: '#000', fill: '#000'}
|
||||
);
|
||||
models.push(model);
|
||||
}
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
console.log(models)
|
||||
return models;
|
||||
},
|
||||
|
||||
/** 更新数据并解析成折线*/
|
||||
updateDataToModels(chart, planData, stations, kmRangeCoordMap, series) {
|
||||
updateDataToModels(chart, planData, stations, kmRangeCoordinateMap, series) {
|
||||
if (planData && planData.length) {
|
||||
}
|
||||
return series;
|
||||
@ -160,14 +223,29 @@ export default {
|
||||
});
|
||||
|
||||
return yText;
|
||||
},
|
||||
},
|
||||
|
||||
/** 根据方向计算y折返偏移量*/
|
||||
getYvalueByDirectionCode(defaultVlue, direction) {
|
||||
if (direction === '1') {
|
||||
defaultVlue -= this.EdgeHeight / 2;
|
||||
} else if (direction === '2') {
|
||||
defaultVlue += this.EdgeHeight / 2;
|
||||
}
|
||||
|
||||
return defaultVlue;
|
||||
},
|
||||
|
||||
|
||||
/** 根据elem计算y值*/
|
||||
getCoordYByObj(stations, kmRangeCoordMap, elem) {
|
||||
getCoordinateYByObj(stations, kmRangeCoordinateMap, obj, direction, isSpecial) {
|
||||
var defaultVlue = 0;
|
||||
var station = stations.find(it => { return it.code == elem.stationCode; });
|
||||
var station = stations.find(it => { return it.code == obj.stationCode; });
|
||||
if (station) {
|
||||
defaultVlue = kmRangeCoordMap[`${station.kmRange}`];
|
||||
defaultVlue = kmRangeCoordinateMap[`${station.kmRange}`];
|
||||
if (isSpecial) {
|
||||
defaultVlue = this.getYvalueByDirectionCode(defaultVlue, direction);
|
||||
}
|
||||
}
|
||||
|
||||
return defaultVlue;
|
||||
|
||||
309
src/jmapNew/theme/aus_00/utils.js
Normal file
309
src/jmapNew/theme/aus_00/utils.js
Normal file
@ -0,0 +1,309 @@
|
||||
import store from '@/store/index_APP_TARGET';
|
||||
import { timeFormat } from '@/utils/date';
|
||||
|
||||
/** 创建一个车次数据点*/
|
||||
export function createMartPoint(opt) {
|
||||
const rotate = opt.direction == '2' ? 45 : (opt.direction == '1' ? -45 : 0);
|
||||
const position = opt.type ? 'insideBottomLeft' : 'insideTopLeft';
|
||||
return {
|
||||
coord: opt.coord,
|
||||
name: opt.name,
|
||||
label: {
|
||||
normal: {
|
||||
rotate: rotate,
|
||||
formatter: '{b}',
|
||||
backgroundColor: 'rgb(242,242,242,0.1)',
|
||||
color: 'black',
|
||||
position: position
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
/** 创建一个车次数据序列*/
|
||||
export function createSeriesModel(opt, lineStyle={}, itemStyle={}) {
|
||||
return {
|
||||
z: opt.z || 5,
|
||||
zlevel: opt.zlevel || 0,
|
||||
type: 'line',
|
||||
name: opt.name,
|
||||
data: opt.data,
|
||||
sampling: 'average',
|
||||
symbolSize: opt.symbolSize,
|
||||
showAllSymbol: opt.showAllSymbol||'auto',
|
||||
lineStyle: lineStyle,
|
||||
itemStyle: itemStyle,
|
||||
markPoint: {
|
||||
symbol: 'roundRect',
|
||||
symbolSize: 1,
|
||||
data: opt.markPoint.data
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
/** 创建标记横线*/
|
||||
export function createMarkLineModels(stations, computedYaxis) {
|
||||
const markLineModel = {};
|
||||
if (stations && stations.length) {
|
||||
markLineModel.type = 'line';
|
||||
markLineModel.name = 'markline';
|
||||
markLineModel.markLine = {};
|
||||
markLineModel.markLine.silent = true;
|
||||
markLineModel.markLine.data = [];
|
||||
markLineModel.markLine.lineStyle = { color: '#B0C4DE', width: 0.5 };
|
||||
markLineModel.markLine.symbol = 'none';
|
||||
markLineModel.elements = []
|
||||
stations.forEach((elem, index) => {
|
||||
markLineModel.markLine.data.push(
|
||||
{
|
||||
label: {
|
||||
show: true,
|
||||
position: 'start',
|
||||
formatter: elem.name,
|
||||
color: 'black'
|
||||
},
|
||||
lineStyle: {
|
||||
type: 'solid',
|
||||
width: 0.5,
|
||||
opacity: 0.5
|
||||
},
|
||||
yAxis: computedYaxis(elem, index)
|
||||
}
|
||||
);
|
||||
});
|
||||
}
|
||||
return markLineModel;
|
||||
}
|
||||
|
||||
/** 创建不会重复颜色的内部对象*/
|
||||
export const hexColor = {
|
||||
colorIndex: 0,
|
||||
difValue: 0.25, // 一般为0.25
|
||||
oddColor: null,
|
||||
eveColor: null,
|
||||
oldColor: null,
|
||||
newColor: null,
|
||||
colorList: [
|
||||
'#000000', '#0000FF', '#8A2BE2', '#A52A2A', '#DEB887', '#5F9EA0', '#7FFF00', '#FF7F50', '#6495ED', '#DC143C',
|
||||
'#00FFFF', '#008B8B', '#B8860B', '#BDB76B', '#8B008B', '#FF8C00', '#9932CC', '#8FBC8F', '#FF1493', '#00BFFF',
|
||||
'#FF00FF', '#FFD700', '#FF69B4', '#FF4500', '#DB7093', '#4169E1', '#6A5ACD', '#00FF7F', '#EE82EE', '#40E0D0'
|
||||
],
|
||||
colors: [
|
||||
'#B9C671', '#6C9040', '#79C671', '#71A5C6', '#C6A071', '#71C689', '#'
|
||||
],
|
||||
randomHsl: function () {
|
||||
const h = Math.random();
|
||||
const s = Math.random();
|
||||
const l = Math.random();
|
||||
return [h, s, l];
|
||||
},
|
||||
hslToRgb: function (h, s, l) {
|
||||
let r, g, b;
|
||||
|
||||
if (s === 0) {
|
||||
r = g = b = l; // achromatic
|
||||
} else {
|
||||
const hue2rgb = function hue2rgb(p, q, t) {
|
||||
if (t < 0) t += 1;
|
||||
if (t > 1) t -= 1;
|
||||
if (t < 1 / 6) return p + (q - p) * 6 * t;
|
||||
if (t < 1 / 2) return q;
|
||||
if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
|
||||
return p;
|
||||
};
|
||||
|
||||
const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
||||
const p = 2 * l - q;
|
||||
r = hue2rgb(p, q, h + 1 / 3);
|
||||
g = hue2rgb(p, q, h);
|
||||
b = hue2rgb(p, q, h - 1 / 3);
|
||||
}
|
||||
|
||||
return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];
|
||||
},
|
||||
rgbToHsl: function (r, g, b) {
|
||||
// eslint-disable-next-line no-sequences
|
||||
r /= 255, g /= 255, b /= 255;
|
||||
const max = Math.max(r, g, b); const min = Math.min(r, g, b);
|
||||
let h; let s; const l = (max + min) / 2;
|
||||
|
||||
if (max === min) {
|
||||
h = s = 0; // achromatic
|
||||
} else {
|
||||
const d = max - min;
|
||||
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
|
||||
switch (max) {
|
||||
case r: h = (g - b) / d + (g < b ? 6 : 0); break;
|
||||
case g: h = (b - r) / d + 2; break;
|
||||
case b: h = (r - g) / d + 4; break;
|
||||
}
|
||||
h /= 6;
|
||||
}
|
||||
|
||||
return [h, s, l];
|
||||
},
|
||||
// 固定颜色
|
||||
colorFixed() {
|
||||
var color = this.colorList[this.colorIndex++ % this.colorList.length];
|
||||
return color;
|
||||
},
|
||||
// 随机颜色
|
||||
colorRandom() {
|
||||
return '#' + (Math.random() * 0xffffff << 0).toString(16);
|
||||
},
|
||||
// 生成和前一个不同的随机颜色
|
||||
colorContrast() {
|
||||
this.newColor = this.randomHsl(); // 获取随机的hsl,并且给一个默认的hsl
|
||||
this.newColor[1] = 0.7 + this.newColor[1] * 0.2; // [0.7 - 0.9] 排除过灰颜色
|
||||
this.newColor[2] = 0.4 + this.newColor[2] * 0.2; // [0.4 - 0.8] 排除过亮过暗色
|
||||
|
||||
/** 如果oldColor不为空时，要根据车次号保证两次生成的颜色差值为difValue*/
|
||||
this.oldColor = Number(this.colorIndex) % 2 ? this.oddColor : this.eveColor;
|
||||
if (this.oldColor) {
|
||||
/** 保证本次的颜色和上次的不一致*/
|
||||
for (let i = 0; i < this.newColor.length && i < this.oldColor.length; i++) {
|
||||
if (i === 0 && Math.abs(this.newColor[i].toFixed(2) - this.oldColor[i].toFixed(2)) < this.difValue) {
|
||||
this.colorRandom();
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/** 保存之前的颜色状态*/
|
||||
if (Number(this.colorIndex) % 2) {
|
||||
this.oddColor = this.newColor;
|
||||
} else {
|
||||
this.eveColor = this.newColor;
|
||||
}
|
||||
|
||||
this.colorIndex += 1;
|
||||
return `#${this.hslToRgb(...this.newColor).map(e => { return Number(e).toString(16); }).join('')}`;
|
||||
},
|
||||
// 渐进颜色
|
||||
colorProgressiveColor() {
|
||||
},
|
||||
toCreate: function () {
|
||||
return this.colorRandom();
|
||||
}
|
||||
};
|
||||
|
||||
/** 对list数据进行排序, 相同元素保持原有顺序*/
|
||||
export function sortListByCallBack(list, callback) {
|
||||
list.map((elem, index) => { elem[`oldIndex`] = index; });
|
||||
list.sort((a, b) => {
|
||||
return callback(a, b) || a.oldIndex - b.oldIndex;
|
||||
});
|
||||
return list;
|
||||
}
|
||||
|
||||
/** 将数字转换成asc码*/
|
||||
export function numToAsc(num) {
|
||||
const nmA = 'A'.charCodeAt(0);
|
||||
const nmZ = 'Z'.charCodeAt(0);
|
||||
const len = nmZ - nmA + 1;
|
||||
let str = '';
|
||||
|
||||
while (num >= 0) {
|
||||
str = String.fromCharCode(num % len + nmA) + str;
|
||||
num = Math.floor(num / len) - 1;
|
||||
}
|
||||
|
||||
return str;
|
||||
}
|
||||
|
||||
/** 将asc码转换成数字*/
|
||||
export function ascToNum(asc) {
|
||||
const base = 'A'.charCodeAt() - 1;
|
||||
let idx = asc.length - 1;
|
||||
let num = 0;
|
||||
let mulFactor = 1;
|
||||
while (idx >= 0) {
|
||||
num += (asc[idx].charCodeAt() - base) * mulFactor;
|
||||
mulFactor *= 26;
|
||||
idx -= 1;
|
||||
}
|
||||
|
||||
return num;
|
||||
}
|
||||
|
||||
/** 根据索引获取单元格的数据*/
|
||||
export function getCellValue(Sheet, index) {
|
||||
let value;
|
||||
const cell = Sheet[index];
|
||||
if (cell) {
|
||||
value = cell.w || cell.v;
|
||||
}
|
||||
|
||||
return value;
|
||||
}
|
||||
|
||||
/** 转换sheet数据为json数据*/
|
||||
export function convertSheetToList(Sheet, isReverse) {
|
||||
const dataList = [];
|
||||
|
||||
if (Sheet) {
|
||||
const refarea = Sheet['!ref'];
|
||||
const regular = /([a-zA-Z]+)([0-9]+):([a-zA-Z]+)([0-9]+)/i;
|
||||
|
||||
if (refarea == null) return []; // "A1:M698"
|
||||
if (regular.test(refarea)) {
|
||||
/** 正则转换解析行列数据*/
|
||||
const CoordList = regular.exec(refarea);
|
||||
/** 转换数据为二维数组*/
|
||||
const colBeg = ascToNum(CoordList[1]);
|
||||
const colEnd = ascToNum(CoordList[3]);
|
||||
const rowBeg = Number(CoordList[2]);
|
||||
const rowEnd = Number(CoordList[4]);
|
||||
|
||||
if (isReverse) {
|
||||
for (let i = colBeg - 1; i < colEnd; i++) {
|
||||
dataList.push([]);
|
||||
for (let j = rowBeg; j <= rowEnd; j++) {
|
||||
dataList[dataList.length - 1].push(getCellValue(Sheet, numToAsc(i) + j));
|
||||
}
|
||||
}
|
||||
} else {
|
||||
for (let i = rowBeg; i <= rowEnd; i++) {
|
||||
dataList.push([]);
|
||||
for (let j = colBeg - 1; j < colEnd; j++) {
|
||||
dataList[dataList.length - 1].push(getCellValue(Sheet, numToAsc(j) + i));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return dataList;
|
||||
}
|
||||
|
||||
/** 通过time将时间格式化*/
|
||||
export function formatTime(time) {
|
||||
if (Number.isInteger(time)) {
|
||||
return timeFormat(time);
|
||||
} else {
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
/** 通过code将名称格式化*/
|
||||
export function formatName(code) {
|
||||
let name = '';
|
||||
const device = store.getters['map/getDeviceByCode'](code);
|
||||
if (device) {
|
||||
name = device.name;
|
||||
}
|
||||
return name;
|
||||
}
|
||||
|
||||
/** 将时间格式化前补零*/
|
||||
export function prefixTime(time) {
|
||||
let str = `${time}` || '';
|
||||
if (str) {
|
||||
const list = str.split(':');
|
||||
str = list.map(elem => {
|
||||
return `00000${elem}`.substr(-2);
|
||||
}).join(':');
|
||||
}
|
||||
|
||||
return str;
|
||||
}
|
||||
@ -17,7 +17,7 @@
|
||||
<div class="header">
|
||||
<div class="menus-left">
|
||||
<el-button type="primary" @click="doNewPlan">New</el-button>
|
||||
<el-button type="primary" @click="onDialog(DeviceMenu.planSetParams)">Set Param</el-button>
|
||||
<el-button type="primary" @click="onDialog(MenuEnum.planSetParams)">Set Param</el-button>
|
||||
</div>
|
||||
<div class="menus-right">
|
||||
<span style="font-size:22px;padding:0 17px;">Plan</span>
|
||||
@ -46,7 +46,7 @@ import PlanJustStop from './dialog/planJustStop.vue';
|
||||
import PlanSetParams from './dialog/planSetParams.vue';
|
||||
import PlanModifyArea from './dialog/planModifyArea.vue';
|
||||
import Menus from './menus.vue';
|
||||
import { DeviceMenu } from '@/scripts/ConstDic';
|
||||
import { MenuEnum } from './utils.js';
|
||||
import { timeFormat } from '@/utils/date';
|
||||
import { mapGetters } from 'vuex';
|
||||
import { getStationList } from '@/api/runplan';
|
||||
@ -99,8 +99,8 @@ export default {
|
||||
lineCode() {
|
||||
return '00';
|
||||
},
|
||||
DeviceMenu() {
|
||||
return DeviceMenu;
|
||||
MenuEnum() {
|
||||
return MenuEnum;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
@ -157,6 +157,7 @@ export default {
|
||||
onClear() {
|
||||
this.model.action = '';
|
||||
this.selected = null;
|
||||
this.target = null;
|
||||
this.$refs.schedule.setLineReset();
|
||||
this.$refs.schedule.clearGraphic();
|
||||
},
|
||||
|
||||
@ -47,7 +47,7 @@ export default {
|
||||
myChart: null,
|
||||
stations: [],
|
||||
planData: [],
|
||||
kmRangeCoordMap:{}
|
||||
kmRangeCoordinateMap:{}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@ -148,11 +148,17 @@ export default {
|
||||
type: 'inside',
|
||||
zoomOnMouseWheel : 'ctrl',
|
||||
moveOnMouseMove : 'ctrl',
|
||||
moveOnMouseWheel: 'ctrl'
|
||||
},
|
||||
{
|
||||
type: 'slider',
|
||||
filterMode: 'empty',
|
||||
fiterMode: 'filter',
|
||||
handleSize: '80%',
|
||||
handleStyle: {
|
||||
color: '#fff',
|
||||
shadowBlur: 3,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.6)',
|
||||
shadowOffsetX: 2,
|
||||
shadowOffsetY: 2
|
||||
},
|
||||
bottom: '20px'
|
||||
}
|
||||
]
|
||||
@ -231,7 +237,7 @@ export default {
|
||||
this.myChart.showLoading();
|
||||
|
||||
this.stations = stations;
|
||||
this.kmRangeCoordMap = this.planUtil.convertStationsToMap(this.stations);
|
||||
this.kmRangeCoordinateMap = this.planUtil.convertStationsToMap(this.stations);
|
||||
this.xAxisInit(stations);
|
||||
this.yAxisInit(stations);
|
||||
|
||||
@ -252,8 +258,8 @@ export default {
|
||||
this.planData = planData;
|
||||
|
||||
this.pushModels(option.series, [this.planUtil.initializeYaxis(this.stations)]);
|
||||
this.pushModels(option.series, this.planUtil.parseDataToSeries(this.myChart, planData, this.stations, this.kmRangeCoordMap));
|
||||
this.pushModels(option.graphic[0].elements, this.planUtil.parseDataToGraph(this.myChart, planData, this.stations, this.kmRangeCoordMap));
|
||||
this.pushModels(option.series, this.planUtil.parseDataToSeries(this.myChart, planData, this.stations, this.kmRangeCoordinateMap));
|
||||
this.pushModels(option.graphic[0].elements, this.planUtil.parseDataToGraph(this.myChart, planData, this.stations, this.kmRangeCoordinateMap));
|
||||
|
||||
this.myChart.setOption(option, {notMerge: true});
|
||||
} catch (error) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user