# 设计页
路径 D:\ireport365\ireport365.war\js\enduser\designer\vs-component-echarts.js
一添加地图
~~~
{
name: "",
type: "echartsBubbleMap",
coverImage: contextPath + "/images/componenttypes/" + locale + "/widget/zh_baiduMap.png?v=3",
coverImageWidth: "50%",
tip: "气泡地图"
}
~~~
添加判断的初始化大小
~~~
if (b.type === "echartsBubbleMap") {
b.sizeX = 4;
b.sizeY = 18
}
~~~
二 添加地图数据 顶级变量 和3D地图数据通用 后期加3d地图也用此数据
~~~
let geoCoordMap3d = {
"海门": [121.15, 31.89],
"鄂尔多斯": [109.781327, 39.608266],
"招远": [120.38, 37.35],
"舟山": [122.207216, 29.985295],
"齐齐哈尔": [123.97, 47.33],
"盐城": [120.13, 33.38],
"赤峰": [118.87, 42.28],
"青岛": [120.33, 36.07],
"乳山": [121.52, 36.89],
"金昌": [102.188043, 38.520089],
"泉州": [118.58, 24.93],
"莱西": [120.53, 36.86],
"日照": [119.46, 35.42],
"胶南": [119.97, 35.88],
"南通": [121.05, 32.08],
"拉萨": [91.11, 29.97],
"云浮": [112.02, 22.93],
"梅州": [116.1, 24.55],
"文登": [122.05, 37.2],
"上海": [121.48, 31.22],
"攀枝花": [101.718637, 26.582347],
"威海": [122.1, 37.5],
"承德": [117.93, 40.97],
"厦门": [118.1, 24.46],
"汕尾": [115.375279, 22.786211],
"潮州": [116.63, 23.68],
"丹东": [124.37, 40.13],
"太仓": [121.1, 31.45],
"曲靖": [103.79, 25.51],
"烟台": [121.39, 37.52],
"福州": [119.3, 26.08],
"瓦房店": [121.979603, 39.627114],
"即墨": [120.45, 36.38],
"抚顺": [123.97, 41.97],
"玉溪": [102.52, 24.35],
"张家口": [114.87, 40.82],
"阳泉": [113.57, 37.85],
"莱州": [119.942327, 37.177017],
"湖州": [120.1, 30.86],
"汕头": [116.69, 23.39],
"昆山": [120.95, 31.39],
"宁波": [121.56, 29.86],
"湛江": [110.359377, 21.270708],
"揭阳": [116.35, 23.55],
"荣成": [122.41, 37.16],
"连云港": [119.16, 34.59],
"葫芦岛": [120.836932, 40.711052],
"常熟": [120.74, 31.64],
"东莞": [113.75, 23.04],
"河源": [114.68, 23.73],
"淮安": [119.15, 33.5],
"泰州": [119.9, 32.49],
"南宁": [108.33, 22.84],
"营口": [122.18, 40.65],
"惠州": [114.4, 23.09],
"江阴": [120.26, 31.91],
"蓬莱": [120.75, 37.8],
"韶关": [113.62, 24.84],
"嘉峪关": [98.289152, 39.77313],
"广州": [113.23, 23.16],
"延安": [109.47, 36.6],
"太原": [112.53, 37.87],
"清远": [113.01, 23.7],
"中山": [113.38, 22.52],
"昆明": [102.73, 25.04],
"寿光": [118.73, 36.86],
"盘锦": [122.070714, 41.119997],
"长治": [113.08, 36.18],
"深圳": [114.07, 22.62],
"珠海": [113.52, 22.3],
"宿迁": [118.3, 33.96],
"咸阳": [108.72, 34.36],
"铜川": [109.11, 35.09],
"平度": [119.97, 36.77],
"佛山": [113.11, 23.05],
"海口": [110.35, 20.02],
"江门": [113.06, 22.61],
"章丘": [117.53, 36.72],
"肇庆": [112.44, 23.05],
"大连": [121.62, 38.92],
"临汾": [111.5, 36.08],
"吴江": [120.63, 31.16],
"石嘴山": [106.39, 39.04],
"沈阳": [123.38, 41.8],
"苏州": [120.62, 31.32],
"茂名": [110.88, 21.68],
"嘉兴": [120.76, 30.77],
"长春": [125.35, 43.88],
"胶州": [120.03336, 36.264622],
"银川": [106.27, 38.47],
"张家港": [120.555821, 31.875428],
"三门峡": [111.19, 34.76],
"锦州": [121.15, 41.13],
"南昌": [115.89, 28.68],
"柳州": [109.4, 24.33],
"三亚": [109.511909, 18.252847],
"自贡": [104.778442, 29.33903],
"吉林": [126.57, 43.87],
"阳江": [111.95, 21.85],
"泸州": [105.39, 28.91],
"西宁": [101.74, 36.56],
"宜宾": [104.56, 29.77],
"呼和浩特": [111.65, 40.82],
"成都": [104.06, 30.67],
"大同": [113.3, 40.12],
"镇江": [119.44, 32.2],
"桂林": [110.28, 25.29],
"张家界": [110.479191, 29.117096],
"宜兴": [119.82, 31.36],
"北海": [109.12, 21.49],
"西安": [108.95, 34.27],
"金坛": [119.56, 31.74],
"东营": [118.49, 37.46],
"牡丹江": [129.58, 44.6],
"遵义": [106.9, 27.7],
"绍兴": [120.58, 30.01],
"扬州": [119.42, 32.39],
"常州": [119.95, 31.79],
"潍坊": [119.1, 36.62],
"重庆": [106.54, 29.59],
"台州": [121.420757, 28.656386],
"南京": [118.78, 32.04],
"滨州": [118.03, 37.36],
"贵阳": [106.71, 26.57],
"无锡": [120.29, 31.59],
"本溪": [123.73, 41.3],
"克拉玛依": [84.77, 45.59],
"渭南": [109.5, 34.52],
"马鞍山": [118.48, 31.56],
"宝鸡": [107.15, 34.38],
"焦作": [113.21, 35.24],
"句容": [119.16, 31.95],
"北京": [116.46, 39.92],
"徐州": [117.2, 34.26],
"衡水": [115.72, 37.72],
"包头": [110, 40.58],
"绵阳": [104.73, 31.48],
"乌鲁木齐": [87.68, 43.77],
"枣庄": [117.57, 34.86],
"杭州": [120.19, 30.26],
"淄博": [118.05, 36.78],
"鞍山": [122.85, 41.12],
"溧阳": [119.48, 31.43],
"库尔勒": [86.06, 41.68],
"安阳": [114.35, 36.1],
"开封": [114.35, 34.79],
"济南": [117, 36.65],
"德阳": [104.37, 31.13],
"温州": [120.65, 28.01],
"九江": [115.97, 29.71],
"邯郸": [114.47, 36.6],
"临安": [119.72, 30.23],
"兰州": [103.73, 36.03],
"沧州": [116.83, 38.33],
"临沂": [118.35, 35.05],
"南充": [106.110698, 30.837793],
"天津": [117.2, 39.13],
"富阳": [119.95, 30.07],
"泰安": [117.13, 36.18],
"诸暨": [120.23, 29.71],
"郑州": [113.65, 34.76],
"哈尔滨": [126.63, 45.75],
"聊城": [115.97, 36.45],
"芜湖": [118.38, 31.33],
"唐山": [118.02, 39.63],
"平顶山": [113.29, 33.75],
"邢台": [114.48, 37.05],
"德州": [116.29, 37.45],
"济宁": [116.59, 35.38],
"荆州": [112.239741, 30.335165],
"宜昌": [111.3, 30.7],
"义乌": [120.06, 29.32],
"丽水": [119.92, 28.45],
"洛阳": [112.44, 34.7],
"秦皇岛": [119.57, 39.95],
"株洲": [113.16, 27.83],
"石家庄": [114.48, 38.03],
"莱芜": [117.67, 36.19],
"常德": [111.69, 29.05],
"保定": [115.48, 38.85],
"湘潭": [112.91, 27.87],
"金华": [119.64, 29.12],
"岳阳": [113.09, 29.37],
"长沙": [113, 28.21],
"衢州": [118.88, 28.97],
"廊坊": [116.7, 39.53],
"菏泽": [115.480656, 35.23375],
"合肥": [117.27, 31.86],
"武汉": [114.31, 30.52],
"大庆": [125.03, 46.58],
"安徽": [117.17, 31.52],
"澳门": [115.07, 21.33],
"北京": [116.24, 39.55],
"福建": [119.18, 26.05],
"甘肃": [103.51, 36.04],
"广东": [113.14, 23.08],
"广西": [108.19, 22.48],
"贵州": [106.42, 26.35],
"海南": [110.2, 20.02],
"河北": [114.3, 38.02],
"河南": [11340, 34.46],
"黑龙江": [126.36, 45.44],
"湖北": [114.17, 30.35],
"湖南": [112.59, 28.12],
"吉林": [125.19, 43.54],
"江苏": [118.46, 32.03],
"江西": [115.55, 28.4],
"辽宁": [123.25, 41.48],
"内蒙古": [111.41, 40.48],
"宁夏": [106.16, 38.27],
"青海": [101.48, 36.38],
"山东": [117, 36.4],
"山西": [112.33, 37.54],
"陕西": [108.57, 34.17],
"上海": [121.29, 31.14],
"四川": [104.04, 30.4],
"台湾": [121.3, 25.03],
"天津": [117.12, 39.02],
"西藏": [91.08, 29.39],
"香港": [115.12, 21.23],
"新疆": [87.36, 43.45],
"云南": [102.42, 25.04],
"浙江": [120.1, 30.16],
"重庆": [106.33, 29.35]
};
~~~
三 echarts对象 模板
~~~
// 气泡地图
// 模板
echartsBubbleMapOptionTemplate = {
title: {
show:false
},
tooltip: {
trigger: 'item',
formatter: "{a} <br/>{b} : {c}"
},
legend: {
orient: 'vertical',
y: 'bottom',
x: 'right',
data: ['sell_area'],
textStyle: {
color: '#fff'
}
},
visualMap: {
show: false,
min: 0,
max: 10000,
left: 'left',
top: 'bottom',
text: ['高', '低'], // 文本，默认为数值文本
calculable: true,
seriesIndex: [1],
inRange: {
color: ['#0f0c29', '#302b63', '#24243e'] // 黑紫黑
}
},
geo: {
show: true,
map: 'china',
label: {
normal: {
show: false
},
emphasis: {
show: false,
}
},
roam: true,
itemStyle: {
normal: {
areaColor: '#031525',
borderColor: '#3B5077',
},
emphasis: {
areaColor: '#2B91B7',
borderColor: '#3B5077'
}
}
},
series: [{
name: '散点',
type: 'scatter',
coordinateSystem: 'geo',
data: '',
symbolSize: function(val) {
return val[2] / 1200;
},
label: {
normal: {
formatter: '{b}',
position: 'right',
show: false
},
emphasis: {
show: false //鼠标移入地区文字显示
}
},
itemStyle: {
normal: {
color: '#05C3F9'
}
}
},
{
type: 'map',
map: 'china',
geoIndex: 0,
aspectScale: 0.75, //长宽比
showLegendSymbol: false, // 存在legend时显示
label: {
normal: {
show: false
},
emphasis: {
show: false,
textStyle: {
color: '#fff'
}
}
},
roam: true,
itemStyle: {
normal: {
areaColor: '#031525',
borderColor: '#3B5077',
},
emphasis: {
areaColor: '#2B91B7',
borderColor: '#3B5077'
}
},
animation: false,
data: ''
},
{
name: '',
type: 'scatter',
coordinateSystem: 'geo',
symbol: 'pin',
symbolSize: function(val) {
var a = (100 - 20) / (10000 - 20);
var b = 20 - a * 10000;
b = 100 - a * 10000;
return a * val[2] + b;
},
label: {
normal: {
show: false,
textStyle: {
color: '#fff',
fontSize: 9,
}
}
},
itemStyle: {
normal: {
color: '#ff8800', //标志颜色
}
},
zlevel: 12,
data: '',
},
]
};
// end
~~~
四 在buildChartOption 图形函数里添加
~~~
case "echartsBubbleMap":
// 初始化数据
var data = [{
name: '海南',
value: 925.73
},
{
name: '河南',
value: 737.01
},
{
name: '河北',
value: 177.64
},
{
name: '湖北',
value: 174.96
},
{
name: '广东',
value: 230.15
},
{
name: '湖南',
value: 9173.05
},
{
name: '江西',
value: 23.08
},
{
name: '黑龙江',
value: 829.69
},
{
name: '四川',
value: 158.43
},
{
name: '安徽',
value: 930.80
},
];
// 处理数据函数
var convertData = function(data) {
var res = [];
for (var i = 0; i < data.length; i++) {
var geoCoord = geoCoordMap3d[data[i].name];
if (geoCoord) {
res.push({
name: data[i].name,
value: geoCoord.concat(data[i].value)
});
}
}
// console.log(res)
return res;
};
option = angular.copy(echartsBubbleMapOptionTemplate);
option.series[0].data = convertData(data);
option.series[1].data = data;
option.series[2].data = convertData(data);
break;
~~~
五 添加 数据函数判断
~~~
case "echartsBubbleMap":
internalRefreshechartsBubbleMapModelData();
break;
~~~
六 处理数据函数
~~~
//echarts气泡地图函数
var internalRefreshechartsBubbleMapModelData = function(){
// 处理数据函数
var convertData = function(data) {
var res = [];
for (var i = 0; i < data.length; i++) {
var geoCoord = geoCoordMap3d[data[i].name];
if (geoCoord) {
res.push({
name: data[i].name,
value: geoCoord.concat(data[i].value.toString())
});
}
}
// console.log(res)
return res;
};
var option = component.config.chartConfig;
var dimensions = component.config.datasourceConfig.dimensions;
var measures = component.config.datasourceConfig.measures;
var data = component.context.data;
var chartData = [];
var chartDataMap = {};
var measureIdx = 0;
if (component.config.receiveMeasureLink != null && component.config.receiveMeasureLink === true) {
var newMeasures = scope.getSelectedLinkMeasure(component, component.config.datasourceConfig.measures);
for (var i = 0; i < measures.length; i++) {
if (newMeasures[i] != null) {
measureIdx = i;
break
}
}
}
for (var i = 0; i < data.length; i++) {
var value = data[i][measures[measureIdx].name];
var name = factory._internalFindKvValue(component, data[i][dimensions[dimensions.length - 1].name]);
chartData.push({
name: name,
value: value
});
var dataMap = chartDataMap[data[i][dimensions[dimensions.length - 1].name]];
if (dataMap == null) {
dataMap = {};
chartDataMap[name] = dataMap
}
for (var m = 0; m < measures.length; m++) {
dataMap[measures[m].name] = data[i][measures[m].name]
}
}
if (component.config["measureAlias_" + measureIdx] != null && component.config["measureAlias_" + measureIdx].length > 0) {
option.series[0].name = component.config["measureAlias_" + measureIdx]
}
option.series[0].seriesIndex = measureIdx;
// 度量设置
option.tooltip.formatter = function (p) {
if (component.config.tooltipStatus != null && component.config.tooltipStatus === "hide") {
return ""
}
var seriesIndex = option.series[0].seriesIndex;
if (!VSUtils.isEmpty(component.config.tooltipValueScript)) {
try {
var f = eval("(function(name, params, VSUtils){ " + Base64.decode(component.config.tooltipValueScript) + "})");
return f.call(null, p.name, p, VSUtils)
} catch (e) {
console.log(e)
}
}
var unit = component.config["unit_" + seriesIndex];
if (unit == null) {
unit = ""
}
// console.log(p)
if(p.value[2]== undefined){
return ''
}
var displayValue = $vsUtils.processValue(p.value[2], component.config["digit_" + seriesIndex]);
// console.log(p.seriesName)
var str = p.name + "<br/>" + p.seriesName + ": " + $vsUtils.comdifyValue(displayValue) + "" + unit+"<br/>"+"地理坐标:[" + p.value[0]+","+p.value[1] +"]";
return str
};
option.series[0].name = measures[measureIdx].label;
option.series[2].name = measures[measureIdx].label;
option.series[0].data = convertData(chartData);
option.series[1].data = chartData;
option.series[2].data = convertData(chartData);
component.context.chart.setOption(option, true)
}
~~~
七 接收其他组件联动的方式
~~~
case "echartsBubbleMap":
var dataIndex = -1;
// console.log(component.config.chartConfig)
var option = component.config.chartConfig;
console.log(option)
for (var i = 0; i < component.config.chartConfig.series[0].data.length; i++) {
if ("" + component.config.chartConfig.series[0].data[i].name === "" + event.source.value) {
console.log(component.config.chartConfig.series[0].data[i].name)
dataIndex = i;
break
}
}
console.log(dataIndex)
if (dataIndex < 0) {
component.context.chart.dispatchAction({
type: "hideTip"
});
return
}
if (dataIndex > -1) {
console.log(event.source.value)
component.context.chart.dispatchAction({
type: "showTip",
name: event.source.value,
seriesIndex: 0
})
}
break;
~~~
八 推送联动数据
~~~
case "echartsBubbleMap":
component.context.chart.on("mouseover", function (param) {
if (component.config.datasourceConfig.measures == null || component.config.datasourceConfig.dimensions == null) {
return
}
var data = component.context.data;
var dataIndex = param.dataIndex;
var to = param.data.name;
if (to == null || param.value == null || param.value === "-") {
return
}
component.context.tooltipName = to;
scope.notifyDimensionValueChange(null, scope.getLastDimension(), to)
});
break;
~~~
九 internalBuildChartDescription 面板函数里添加配置项
新添加一个switch 和echarts线路图写在一起
~~~
switch (component.type) {
// echarts 气泡图
case "echartsBubbleMap":
chartCategory.groups.push({
title: {
text: "地图配置"
},
elements: [{
title: "地图颜色",
type: "colorpicker",
bind: "mapColor"
},{
title: "地图轮廓色",
type: "colorpicker",
bind: "mapBorderColor"
},{
title: "鼠标移入色",
type: "colorpicker",
bind: "mapActiveColor"
},{
title: "鼠标移入轮廓色",
type: "colorpicker",
bind: "mapBorderActiveColor"
},{
title: "工具",
type: "switch",
bind: "showVisualMap",
on: vsLang.on,
off: vsLang.off
}]
})
chartCategory.groups.push({
title: {
text: "散点配置"
},
elements: [{
title: "移入显示地区",
type: "switch",
bind: "showClass",
on: vsLang.on,
off: vsLang.off
},{
title: "散点颜色",
type: "colorpicker",
bind: "dianColor"
}]
})
chartCategory.groups.push({
title: {
text: "气泡配置"
},
elements: [{
title: "气泡颜色",
type: "colorpicker",
bind: "pieColor"
}]
})
break;
}
~~~
十 在监听配置面板监听函数里 添加监听方法
同理在这里也新建一个switch
~~~
switch (component.type) {
case "echartsBubbleMap":
// 监听地图颜色
scope.$watch("component.config.mapColor", function (newValue) {
if (newValue != null) {
var option = component.config.chartConfig;
option.geo.itemStyle.normal.areaColor = newValue;
option.series[1].itemStyle.normal.areaColor = newValue;
scope.component.context.chart.setOption(option, true);
}
});
// 监听地图轮廓颜色
scope.$watch("component.config.mapBorderColor", function (newValue) {
if (newValue != null) {
var option = component.config.chartConfig;
option.geo.itemStyle.normal.borderColor = newValue;
option.series[1].itemStyle.normal.borderColor = newValue;
scope.component.context.chart.setOption(option, true);
}
});
// 监听鼠标移入地图颜色
scope.$watch("component.config.mapActiveColor", function (newValue) {
if (newValue != null) {
var option = component.config.chartConfig;
option.geo.itemStyle.emphasis.areaColor = newValue;
option.series[1].itemStyle.emphasis.areaColor = newValue;
scope.component.context.chart.setOption(option, true);
}
});
// 监听鼠标移入地图轮廓颜色
scope.$watch("component.config.mapBorderActiveColor", function (newValue) {
if (newValue != null) {
var option = component.config.chartConfig;
option.geo.itemStyle.emphasis.borderColor = newValue;
option.series[1].itemStyle.emphasis.borderColor = newValue;
scope.component.context.chart.setOption(option, true);
}
});
// 监听地图工具开启
scope.$watch("component.config.showVisualMap", function (newValue) {
if (newValue != null) {
var option = component.config.chartConfig;
option.visualMap.show = newValue;
scope.component.context.chart.setOption(option, true);
}
});
// 散点鼠标移入显示地区
scope.$watch("component.config.showClass", function (newValue) {
if (newValue != null) {
var option = component.config.chartConfig;
option.series[0].label.emphasis.show = newValue;
scope.component.context.chart.setOption(option, true);
}
});
// 散点颜色值
scope.$watch("component.config.dianColor", function (newValue) {
if (newValue != null) {
var option = component.config.chartConfig;
option.series[0].itemStyle.normal.color = newValue;
scope.component.context.chart.setOption(option, true);
}
});
//气泡颜色
scope.$watch("component.config.pieColor", function (newValue) {
if (newValue != null) {
var option = component.config.chartConfig;
option.series[2].itemStyle.normal.color = newValue;
scope.component.context.chart.setOption(option, true);
}
});
break
}
~~~
# 分享页
路径D:\ireport365\ireport365.war\WEB-INF\classes\report-resource\design.js
一 添加判断数据处理函数
~~~
case "echartsBubbleMap":
internalRefreshechartsBubbleMapModelData();
break;
}
~~~
二 添加数据处理函数
~~~
// echarts气泡图 数据处理函数
var internalRefreshechartsBubbleMapModelData = function(){
// 处理数据函数
var convertData = function(data) {
var res = [];
for (var i = 0; i < data.length; i++) {
var geoCoord = geoCoordMap3d[data[i].name];
if (geoCoord) {
res.push({
name: data[i].name,
value: geoCoord.concat(data[i].value.toString())
});
}
}
// console.log(res)
return res;
};
var option = component.config.chartConfig;
var dimensions = component.config.datasourceConfig.dimensions;
var measures = component.config.datasourceConfig.measures;
var data = component.context.data;
var chartData = [];
var chartDataMap = {};
var measureIdx = 0;
if (component.config.receiveMeasureLink != null && component.config.receiveMeasureLink === true) {
var newMeasures = scope.getSelectedLinkMeasure(component, component.config.datasourceConfig.measures);
for (var i = 0; i < measures.length; i++) {
if (newMeasures[i] != null) {
measureIdx = i;
break
}
}
}
for (var i = 0; i < data.length; i++) {
var value = data[i][measures[measureIdx].name];
var name = _internalFindKvValue(component, data[i][dimensions[dimensions.length - 1].name]);
chartData.push({
name: name,
value: value
});
console.log(chartData)
var dataMap = chartDataMap[data[i][dimensions[dimensions.length - 1].name]];
if (dataMap == null) {
dataMap = {};
chartDataMap[name] = dataMap
}
for (var m = 0; m < measures.length; m++) {
dataMap[measures[m].name] = data[i][measures[m].name]
}
}
if (component.config["measureAlias_" + measureIdx] != null && component.config["measureAlias_" + measureIdx].length > 0) {
option.series[0].name = component.config["measureAlias_" + measureIdx]
}
option.series[0].seriesIndex = measureIdx;
// 度量设置
option.tooltip.formatter = function (p) {
if (component.config.tooltipStatus != null && component.config.tooltipStatus === "hide") {
return ""
}
var seriesIndex = option.series[0].seriesIndex;
if (!VSUtils.isEmpty(component.config.tooltipValueScript)) {
try {
var f = eval("(function(name, params, VSUtils){ " + Base64.decode(component.config.tooltipValueScript) + "})");
return f.call(null, p.name, p, VSUtils)
} catch (e) {
console.log(e)
}
}
var unit = component.config["unit_" + seriesIndex];
if (unit == null) {
unit = ""
}
// console.log(p)
if(p.value[2]== undefined){
return ''
}
var displayValue = $vsUtils.processValue(p.value[2], component.config["digit_" + seriesIndex]);
// console.log(p.seriesName)
var str = p.name + "<br/>" + p.seriesName + ": " + $vsUtils.comdifyValue(displayValue) + "" + unit+"<br/>"+"地理坐标:[" + p.value[0]+","+p.value[1] +"]";
console.log(str)
return str
};
option.series[0].name = measures[measureIdx].label;
option.series[2].name = measures[measureIdx].label;
option.series[0].data = convertData(chartData);
option.series[1].data = chartData;
option.series[2].data = convertData(chartData);
component.context.chart.setOption(option, true)
}
~~~
三 接收其他组件传来的联动指令
~~~
case "echartsBubbleMap":
var dataIndex = -1;
// console.log(component.config.chartConfig)
var option = component.config.chartConfig;
console.log(option)
for (var i = 0; i < component.config.chartConfig.series[0].data.length; i++) {
if ("" + component.config.chartConfig.series[0].data[i].name === "" + event.source.value) {
console.log(component.config.chartConfig.series[0].data[i].name)
dataIndex = i;
break
}
}
console.log(dataIndex)
if (dataIndex < 0) {
component.context.chart.dispatchAction({
type: "hideTip"
});
return
}
if (dataIndex > -1) {
console.log(event.source.value)
component.context.chart.dispatchAction({
type: "showTip",
name: event.source.value,
seriesIndex: 0
})
}
break;
~~~
四 组件推送联动指令
~~~
case "echartsBubbleMap":
component.context.chart.on("mouseover", function (param) {
if (component.config.datasourceConfig.measures == null || component.config.datasourceConfig.dimensions == null) {
return
}
var data = component.context.data;
var dataIndex = param.dataIndex;
var to = param.data.name;
if (to == null || param.value == null || param.value === "-") {
return
}
component.context.tooltipName = to;
scope.notifyDimensionValueChange(null, scope.getLastDimension(), to)
});
break;
~~~
五 同理添加顶级对象 地图需要坐标数据 后期和新加的地图公用
~~~
let geoCoordMap3d = {
"海门": [121.15, 31.89],
"鄂尔多斯": [109.781327, 39.608266],
"招远": [120.38, 37.35],
"舟山": [122.207216, 29.985295],
"齐齐哈尔": [123.97, 47.33],
"盐城": [120.13, 33.38],
"赤峰": [118.87, 42.28],
"青岛": [120.33, 36.07],
"乳山": [121.52, 36.89],
"金昌": [102.188043, 38.520089],
"泉州": [118.58, 24.93],
"莱西": [120.53, 36.86],
"日照": [119.46, 35.42],
"胶南": [119.97, 35.88],
"南通": [121.05, 32.08],
"拉萨": [91.11, 29.97],
"云浮": [112.02, 22.93],
"梅州": [116.1, 24.55],
"文登": [122.05, 37.2],
"上海": [121.48, 31.22],
"攀枝花": [101.718637, 26.582347],
"威海": [122.1, 37.5],
"承德": [117.93, 40.97],
"厦门": [118.1, 24.46],
"汕尾": [115.375279, 22.786211],
"潮州": [116.63, 23.68],
"丹东": [124.37, 40.13],
"太仓": [121.1, 31.45],
"曲靖": [103.79, 25.51],
"烟台": [121.39, 37.52],
"福州": [119.3, 26.08],
"瓦房店": [121.979603, 39.627114],
"即墨": [120.45, 36.38],
"抚顺": [123.97, 41.97],
"玉溪": [102.52, 24.35],
"张家口": [114.87, 40.82],
"阳泉": [113.57, 37.85],
"莱州": [119.942327, 37.177017],
"湖州": [120.1, 30.86],
"汕头": [116.69, 23.39],
"昆山": [120.95, 31.39],
"宁波": [121.56, 29.86],
"湛江": [110.359377, 21.270708],
"揭阳": [116.35, 23.55],
"荣成": [122.41, 37.16],
"连云港": [119.16, 34.59],
"葫芦岛": [120.836932, 40.711052],
"常熟": [120.74, 31.64],
"东莞": [113.75, 23.04],
"河源": [114.68, 23.73],
"淮安": [119.15, 33.5],
"泰州": [119.9, 32.49],
"南宁": [108.33, 22.84],
"营口": [122.18, 40.65],
"惠州": [114.4, 23.09],
"江阴": [120.26, 31.91],
"蓬莱": [120.75, 37.8],
"韶关": [113.62, 24.84],
"嘉峪关": [98.289152, 39.77313],
"广州": [113.23, 23.16],
"延安": [109.47, 36.6],
"太原": [112.53, 37.87],
"清远": [113.01, 23.7],
"中山": [113.38, 22.52],
"昆明": [102.73, 25.04],
"寿光": [118.73, 36.86],
"盘锦": [122.070714, 41.119997],
"长治": [113.08, 36.18],
"深圳": [114.07, 22.62],
"珠海": [113.52, 22.3],
"宿迁": [118.3, 33.96],
"咸阳": [108.72, 34.36],
"铜川": [109.11, 35.09],
"平度": [119.97, 36.77],
"佛山": [113.11, 23.05],
"海口": [110.35, 20.02],
"江门": [113.06, 22.61],
"章丘": [117.53, 36.72],
"肇庆": [112.44, 23.05],
"大连": [121.62, 38.92],
"临汾": [111.5, 36.08],
"吴江": [120.63, 31.16],
"石嘴山": [106.39, 39.04],
"沈阳": [123.38, 41.8],
"苏州": [120.62, 31.32],
"茂名": [110.88, 21.68],
"嘉兴": [120.76, 30.77],
"长春": [125.35, 43.88],
"胶州": [120.03336, 36.264622],
"银川": [106.27, 38.47],
"张家港": [120.555821, 31.875428],
"三门峡": [111.19, 34.76],
"锦州": [121.15, 41.13],
"南昌": [115.89, 28.68],
"柳州": [109.4, 24.33],
"三亚": [109.511909, 18.252847],
"自贡": [104.778442, 29.33903],
"吉林": [126.57, 43.87],
"阳江": [111.95, 21.85],
"泸州": [105.39, 28.91],
"西宁": [101.74, 36.56],
"宜宾": [104.56, 29.77],
"呼和浩特": [111.65, 40.82],
"成都": [104.06, 30.67],
"大同": [113.3, 40.12],
"镇江": [119.44, 32.2],
"桂林": [110.28, 25.29],
"张家界": [110.479191, 29.117096],
"宜兴": [119.82, 31.36],
"北海": [109.12, 21.49],
"西安": [108.95, 34.27],
"金坛": [119.56, 31.74],
"东营": [118.49, 37.46],
"牡丹江": [129.58, 44.6],
"遵义": [106.9, 27.7],
"绍兴": [120.58, 30.01],
"扬州": [119.42, 32.39],
"常州": [119.95, 31.79],
"潍坊": [119.1, 36.62],
"重庆": [106.54, 29.59],
"台州": [121.420757, 28.656386],
"南京": [118.78, 32.04],
"滨州": [118.03, 37.36],
"贵阳": [106.71, 26.57],
"无锡": [120.29, 31.59],
"本溪": [123.73, 41.3],
"克拉玛依": [84.77, 45.59],
"渭南": [109.5, 34.52],
"马鞍山": [118.48, 31.56],
"宝鸡": [107.15, 34.38],
"焦作": [113.21, 35.24],
"句容": [119.16, 31.95],
"北京": [116.46, 39.92],
"徐州": [117.2, 34.26],
"衡水": [115.72, 37.72],
"包头": [110, 40.58],
"绵阳": [104.73, 31.48],
"乌鲁木齐": [87.68, 43.77],
"枣庄": [117.57, 34.86],
"杭州": [120.19, 30.26],
"淄博": [118.05, 36.78],
"鞍山": [122.85, 41.12],
"溧阳": [119.48, 31.43],
"库尔勒": [86.06, 41.68],
"安阳": [114.35, 36.1],
"开封": [114.35, 34.79],
"济南": [117, 36.65],
"德阳": [104.37, 31.13],
"温州": [120.65, 28.01],
"九江": [115.97, 29.71],
"邯郸": [114.47, 36.6],
"临安": [119.72, 30.23],
"兰州": [103.73, 36.03],
"沧州": [116.83, 38.33],
"临沂": [118.35, 35.05],
"南充": [106.110698, 30.837793],
"天津": [117.2, 39.13],
"富阳": [119.95, 30.07],
"泰安": [117.13, 36.18],
"诸暨": [120.23, 29.71],
"郑州": [113.65, 34.76],
"哈尔滨": [126.63, 45.75],
"聊城": [115.97, 36.45],
"芜湖": [118.38, 31.33],
"唐山": [118.02, 39.63],
"平顶山": [113.29, 33.75],
"邢台": [114.48, 37.05],
"德州": [116.29, 37.45],
"济宁": [116.59, 35.38],
"荆州": [112.239741, 30.335165],
"宜昌": [111.3, 30.7],
"义乌": [120.06, 29.32],
"丽水": [119.92, 28.45],
"洛阳": [112.44, 34.7],
"秦皇岛": [119.57, 39.95],
"株洲": [113.16, 27.83],
"石家庄": [114.48, 38.03],
"莱芜": [117.67, 36.19],
"常德": [111.69, 29.05],
"保定": [115.48, 38.85],
"湘潭": [112.91, 27.87],
"金华": [119.64, 29.12],
"岳阳": [113.09, 29.37],
"长沙": [113, 28.21],
"衢州": [118.88, 28.97],
"廊坊": [116.7, 39.53],
"菏泽": [115.480656, 35.23375],
"合肥": [117.27, 31.86],
"武汉": [114.31, 30.52],
"大庆": [125.03, 46.58],
"安徽": [117.17, 31.52],
"澳门": [115.07, 21.33],
"北京": [116.24, 39.55],
"福建": [119.18, 26.05],
"甘肃": [103.51, 36.04],
"广东": [113.14, 23.08],
"广西": [108.19, 22.48],
"贵州": [106.42, 26.35],
"海南": [110.2, 20.02],
"河北": [114.3, 38.02],
"河南": [11340, 34.46],
"黑龙江": [126.36, 45.44],
"湖北": [114.17, 30.35],
"湖南": [112.59, 28.12],
"吉林": [125.19, 43.54],
"江苏": [118.46, 32.03],
"江西": [115.55, 28.4],
"辽宁": [123.25, 41.48],
"内蒙古": [111.41, 40.48],
"宁夏": [106.16, 38.27],
"青海": [101.48, 36.38],
"山东": [117, 36.4],
"山西": [112.33, 37.54],
"陕西": [108.57, 34.17],
"上海": [121.29, 31.14],
"四川": [104.04, 30.4],
"台湾": [121.3, 25.03],
"天津": [117.12, 39.02],
"西藏": [91.08, 29.39],
"香港": [115.12, 21.23],
"新疆": [87.36, 43.45],
"云南": [102.42, 25.04],
"浙江": [120.1, 30.16],
"重庆": [106.33, 29.35]
};
~~~
- video
- treemap
- mian.html文件注释
- 配置项tab
- 配置项属性
- internalRefreshAxisMdelData函数梳理
- 函数配置项-engine文件
- 替换数据源流程
- design.js
- 树图
- 下钻 废弃
- 人体图
- 下钻地图
- 行列互转
- 预览样式
- logo旁边的报表名
- echarts 组件生成图片
- 数据集样式
- 头部 黑色head
- 手机 ipad 图片
- k线图部分
- 平台管理css样式
- 目录css和平板的边距
- 设计页-数据源-目录
- 数据集 - 查看数据表 -按钮和目录样式
- 报表列表页按钮css
- 角色管理页按钮css
- 推送通知按钮css
- 子账号按钮css
- 数据连接
- openlayers地图线路图
- openlayers4_map_designer.js
- openlayers4_map_view.js
- 说明
- 常用图标小bug
- echarts 气泡地图
- echarts 线路轨迹图
- 导出pdf
- 可视化sql--css
- 表格滚动
- 主题色
- 时间轴
- 分享弹框
- 管理平台header和菜单
- 报表平台和菜单
- 初始化组件颜色
- 其他弹框
- olap分析样式-废弃
- 3d地图柱状图
- 关系图
- olap分析
- 地区地图
- k线图相关属性设置
- 世界地图
- 时间轴（new）
- 选择省份下转地图
- 选择省市飞线地图
- 面积预警地图默认颜色
- 组件覆层开关组件
- 汽车仪表盘bug
- 雷达图bug修复不能分享的问题
- 饼状 条形图 自动播放
- 临时用
- 自动轮播
- 方形元素 按钮浮动报错
- 面积预警地图整合可选择省市区
- 下钻地图添加返回按钮
- 下钻地图修复预警bug
- 基本时间组件
- 添加时钟组件
- 3d地球组件
- 盒须图
- 组件加载动画
- 报表背景渐变色
- 主题模板
- 没用
- 3机房第三方组件
- 设计
- 分享
- 3d机房需要的静态资源
- cesium地球需要的文件以及样式
- cesium地球
- 设计页
- 分享页
- 图标条形图
- 世豪-前端代码整理
- component.css 文件新添加
- 杂项
- index.jsp
- designer.css 样式暂时不整理 里面比较杂
- vs-common.js 新加生成html2canvas pdf
- vs-component-basic.js 完
- vs-component-datasource.js 完
- vs-component-engine.js 完
- vs-component-widget-grid.js 完
- vs-component-widget-square.js 完
- vs-designer.js 完
- vs-designer-component.js 完
- vs-designer-report.js 完
- vs-designer-reportpage.js 完
- vs-component-echarts.js 完
- main.html 完
- component.html 新加组件设置页模板
- 以前的报表页设置控制器---做个记录
- 大概修改过的代码
- 2019-5-8 修改皮肤控制器
- 选择模板
- 桑基图2019-11-20
- bug 修正 2019-11-21
- 插图柱状图
- cesiumchart组件
- gis 地图 联动 弹框 图标
- 动态面积图添加按钮类配置项
- 玫瑰图形组件
- cesium 图形 和three.js 冲突的bug
- gis 地图 默认图层
- 网格标签
- gis 点图 值域
- gis 面图 值域
- 按钮图标添加提示框
- 百度地图
- 剩余的组件
- gulp说明文档
- 色斑图加透明