路线图配置调整

qianming 3 years ago
parent cd52596320
commit 4d095dd071

@ -133,20 +133,103 @@ export const widgetMap = {
], ],
}, },
{ {
name: '字体设置', name: '起点设置',
list: [ list: [
{
type: 'el-switch',
label: '起点显示',
name: 'isShowSource',
required: false,
placeholder: '',
value: true
},
{
type: 'el-input-number',
label: '点大小级别',
name: 'sourcePointSize',
required: false,
placeholder: '',
value: 5,
},
{
type: 'vue-color',
label: '点颜色',
name: 'sourcePointColor',
required: false,
placeholder: '',
value: '#46bee9'
},
{
type: 'el-input-number',
label: '文字大小',
name: 'sourceFontTextSize',
required: false,
placeholder: '',
value: 12,
},
{
type: 'vue-color',
label: '文字颜色',
name: 'sourceFontTextColor',
required: false,
placeholder: '',
value: '#46bee9'
},
{
type: 'el-select',
label: '文字粗细',
name: 'sourceFontTextWeight',
required: false,
placeholder: '',
selectOptions: [
{code: 'normal', name: '正常'},
{code: 'bold', name: '粗体'},
{code: 'bolder', name: '特粗体'},
{code: 'lighter', name: '细体'}
],
value: 'normal'
},
],
},
{
name: '终点设置',
list: [
{
type: 'el-switch',
label: '终点显示',
name: 'isShowTarget',
required: false,
placeholder: '',
value: true
},
{
type: 'el-input-number',
label: '点大小',
name: 'targetPointSize',
required: false,
placeholder: '',
value: 5,
},
{
type: 'vue-color',
label: '点颜色',
name: 'targetPointColor',
required: false,
placeholder: '',
value: '#46bee9'
},
{ {
type: 'el-input-number', type: 'el-input-number',
label: '文字大小', label: '文字大小',
name: 'fontTextSize', name: 'targetFontTextSize',
required: false, required: false,
placeholder: '', placeholder: '',
value: 15, value: 12,
}, },
{ {
type: 'vue-color', type: 'vue-color',
label: '文字颜色', label: '文字颜色',
name: 'fontTextColor', name: 'targetFontTextColor',
required: false, required: false,
placeholder: '', placeholder: '',
value: '#46bee9' value: '#46bee9'
@ -154,7 +237,7 @@ export const widgetMap = {
{ {
type: 'el-select', type: 'el-select',
label: '文字粗细', label: '文字粗细',
name: 'fontTextWeight', name: 'targetFontTextWeight',
required: false, required: false,
placeholder: '', placeholder: '',
selectOptions: [ selectOptions: [
@ -208,27 +291,6 @@ export const widgetMap = {
}, },
], ],
}, },
{
name: '点设置',
list: [
{
type: 'el-input-number',
label: '点大小',
name: 'pointSize',
required: false,
placeholder: '',
value: 5,
},
{
type: 'vue-color',
label: '点颜色',
name: 'pointColor',
required: false,
placeholder: '',
value: '#46bee9'
},
],
},
{ {
name: '线设置', name: '线设置',
list: [ list: [
@ -318,7 +380,7 @@ export const widgetMap = {
relactiveDom: 'dataType', relactiveDom: 'dataType',
relactiveDomValue: 'staticData', relactiveDomValue: 'staticData',
value: [ value: [
{source: '北京市', target: '上海市', value: 95}, /*{source: '', target: '', value: 95},
{source: '北京市', target: '广州市', value: 90}, {source: '北京市', target: '广州市', value: 90},
{source: '北京市', target: '大连市', value: 80}, {source: '北京市', target: '大连市', value: 80},
{source: '北京市', target: '南宁市', value: 70}, {source: '北京市', target: '南宁市', value: 70},
@ -347,7 +409,194 @@ export const widgetMap = {
{source: '广州市', target: '常州市', value: 40}, {source: '广州市', target: '常州市', value: 40},
{source: '广州市', target: '北京市', value: 30}, {source: '广州市', target: '北京市', value: 30},
{source: '广州市', target: '北海市', value: 20}, {source: '广州市', target: '北海市', value: 20},
{source: '广州市', target: '海口市', value: 10}, {source: '广州市', target: '海口市', value: 10},*/
{
"target": "南京市",
"value": 1,
"source": "乐山市"
},
{
"target": "丽江市",
"value": 3,
"source": "丽江市"
},
{
"target": "洛阳市",
"value": 4,
"source": "深圳市"
},
{
"target": "佛山市",
"value": 1,
"source": "北京市"
},
{
"target": "南阳市",
"value": 2,
"source": "上海市"
},
{
"target": "平顶山市",
"value": 4,
"source": "平顶山市"
},
{
"target": "郑州市",
"value": 2,
"source": "银川市"
},
{
"target": "淄博市",
"value": 2,
"source": "合肥市"
},
{
"target": "安庆市",
"value": 1,
"source": "安庆市"
},
{
"target": "杭州市",
"value": 2,
"source": "台州市"
},
{
"target": "塔城地区",
"value": 1,
"source": "漯河市"
},
{
"target": "塔城地区",
"value": 3,
"source": "塔城地区"
},
{
"target": "乐山市",
"value": 1,
"source": "巴中市"
},
{
"target": "佛山市",
"value": 1,
"source": "深圳市"
},
{
"target": "商洛市",
"value": 1,
"source": "平顶山市"
},
{
"target": "苏州市",
"value": 1,
"source": "上海市"
},
{
"target": "合肥市",
"value": 2,
"source": "平顶山市"
},
{
"target": "衡阳市",
"value": 3,
"source": "平顶山市"
},
{
"target": "佛山市",
"value": 3,
"source": "佛山市"
},
{
"target": "无锡市",
"value": 1,
"source": "宁波市"
},
{
"target": "上海市",
"value": 5,
"source": "上海市"
},
{
"target": "洛阳市",
"value": 3,
"source": "洛阳市"
},
{
"target": "漯河市",
"value": 3,
"source": "平顶山市"
},
{
"target": "上海市",
"value": 1,
"source": "呼和浩特市"
},
{
"target": "广州市",
"value": 1,
"source": "深圳市"
},
{
"target": "台州市",
"value": 1,
"source": "佛山市"
},
{
"target": "乌鲁木齐市",
"value": 4,
"source": "深圳市"
},
{
"target": "洛阳市",
"value": 2,
"source": "鹤岗市"
},
{
"target": "淄博市",
"value": 1,
"source": "商洛市"
},
{
"target": "南阳市",
"value": 1,
"source": "呼和浩特市"
},
{
"target": "杭州市",
"value": 1,
"source": "杭州市"
},
{
"target": "佛山市",
"value": 1,
"source": "台州市"
},
{
"target": "普洱市",
"value": 2,
"source": "丽江市"
},
{
"target": "深圳市",
"value": 1,
"source": "上海市"
},
{
"target": "衡阳市",
"value": 1,
"source": "深圳市"
},
{
"target": "平顶山市",
"value": 2,
"source": "商洛市"
},
{
"target": "安阳市",
"value": 1,
"source": "南阳市"
}
], ],
}, },
{ {

@ -229,6 +229,7 @@ export default {
data: [], data: [],
}, },
{ {
//
//name: tempData[0], //name: tempData[0],
type: 'effectScatter', type: 'effectScatter',
coordinateSystem: 'geo', coordinateSystem: 'geo',
@ -255,7 +256,36 @@ export default {
} }
}, },
data: [], data: [],
} },
{
//
//name: tempData[0],
type: 'effectScatter',
coordinateSystem: 'geo',
zlevel: 2,
rippleEffect: {
brushType: 'stroke'
},
label: {
normal: {
show: true,
position: 'right',
formatter: '{b}',
fontSize: 22,
}
},
//
symbolSize: function (val) {
return val[2] / pointSize;
},
itemStyle: {
normal: {
//
color: '#46bee9'
}
},
data: [],
},
] ]
}, },
optionsSetup: {} optionsSetup: {}
@ -314,10 +344,12 @@ export default {
}, },
editorOptions() { editorOptions() {
this.setOptionsTitle(); this.setOptionsTitle();
this.setOptionsText(); //this.setOptionsText();
this.setOptionsSymbol(); this.setOptionsSymbol();
this.setOptionsPoint(); //this.setOptionsPoint();
this.setOptionsLine(); this.setOptionsLine();
this.setOptionsSource();
this.setOptionsTarget();
this.setOptionsColor(); this.setOptionsColor();
this.setOptionsData(); this.setOptionsData();
}, },
@ -341,10 +373,50 @@ export default {
}; };
this.options.title = title; this.options.title = title;
}, },
//
setOptionsSource(){
const optionsSetup = this.optionsSetup;
const series = this.options.series[2];
const normal = {
show: optionsSetup.isShowSource,
position: 'right',
color: optionsSetup.sourceFontTextColor,
fontSize: optionsSetup.sourceFontTextSize,
fontWeight: optionsSetup.sourceFontTextWeight,
};
const itemStyle = {
normal: {
color: optionsSetup.sourcePointColor,
}
};
pointSize = optionsSetup.sourcePointSize;
series.label.normal = normal;
series.itemStyle = itemStyle;
},
//
setOptionsTarget(){
const optionsSetup = this.optionsSetup;
const series = this.options.series[3];
const normal = {
show: optionsSetup.isShowTarget,
position: 'right',
color: optionsSetup.targetFontTextColor,
fontSize: optionsSetup.targetFontTextSize,
fontWeight: optionsSetup.targetFontTextWeight,
};
const itemStyle = {
normal: {
color: optionsSetup.targetPointColor,
}
};
pointSize = optionsSetup.targetPointSize;
series.label.normal = normal;
series.itemStyle = itemStyle;
},
// //
setOptionsText() { setOptionsText() {
const optionsSetup = this.optionsSetup; const optionsSetup = this.optionsSetup;
const lable = this.options.series[2].label; const series = this.options.series;
const normal = { const normal = {
show: true, show: true,
position: 'right', position: 'right',
@ -352,7 +424,8 @@ export default {
fontSize: optionsSetup.fontTextSize, fontSize: optionsSetup.fontTextSize,
fontWeight: optionsSetup.fontTextWeight, fontWeight: optionsSetup.fontTextWeight,
} }
lable["normal"] = normal; series[2].label["normal"] = normal;
series[3].label["normal"] = normal;
}, },
// //
setOptionsSymbol(){ setOptionsSymbol(){
@ -389,14 +462,15 @@ export default {
// //
setOptionsPoint() { setOptionsPoint() {
const optionsSetup = this.optionsSetup; const optionsSetup = this.optionsSetup;
const series = this.options.series[2]; const series = this.options.series;
pointSize = optionsSetup.pointSize pointSize = optionsSetup.pointSize
const itemStyle = { const itemStyle = {
normal: { normal: {
color: optionsSetup.pointColor, color: optionsSetup.pointColor,
} }
}; };
series["itemStyle"] = itemStyle; series[2]["itemStyle"] = itemStyle;
series[3]["itemStyle"] = itemStyle;
}, },
// 线 // 线
setOptionsLine() { setOptionsLine() {
@ -438,9 +512,15 @@ export default {
}, },
staticDataFn(val) { staticDataFn(val) {
const series = this.options.series; const series = this.options.series;
series[0]["data"] = this.convertData(val) series[0]["data"] = this.convertData(val);
series[1]["data"] = this.convertData(val) series[1]["data"] = this.convertData(val);
series[2]["data"] = val.map(function (dataItem) { series[2]["data"] = val.map(function (dataItem) {
return {
name: dataItem.source,
value: geoCoordMap[dataItem.source].concat([dataItem.value])
}
});
series[3]["data"] = val.map(function (dataItem) {
return { return {
name: dataItem.target, name: dataItem.target,
value: geoCoordMap[dataItem.target].concat([dataItem.value]) value: geoCoordMap[dataItem.target].concat([dataItem.value])
@ -466,9 +546,15 @@ export default {
}, },
renderingFn(val) { renderingFn(val) {
const series = this.options.series; const series = this.options.series;
series[0]["data"] = this.convertData(val) series[0]["data"] = this.convertData(val);
series[1]["data"] = this.convertData(val) series[1]["data"] = this.convertData(val);
series[2]["data"] = val.map(function (dataItem) { series[2]["data"] = val.map(function (dataItem) {
return {
name: dataItem.source,
value: geoCoordMap[dataItem.source].concat([dataItem.value])
}
});
series[3]["data"] = val.map(function (dataItem) {
return { return {
name: dataItem.target, name: dataItem.target,
value: geoCoordMap[dataItem.target].concat([dataItem.value]) value: geoCoordMap[dataItem.target].concat([dataItem.value])

Loading…
Cancel
Save