Skip to content

S
station-elec-manage-view
Commit c9a0e3e0 authored by xinglei's avatar xinglei
Browse files
Options

首页地图合并

parent 42d4e23a
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1115 additions and 4 deletions
amos.config.js
View file @ c9a0e3e0
...@@ -12,7 +12,8 @@ ...@@ -12,7 +12,8 @@
//安全平台地址 //安全平台地址
securityBaseURI: 'http://172.16.10.72:10005/', securityBaseURI: 'http://172.16.10.72:10005/',
//基础平台 //基础平台
loginURI: 'http://172.16.10.72/' loginURI: 'http://172.16.10.72/',
picURI: 'http://172.16.3.121:8001/'
}, },
// websocket 地址 // websocket 地址
wsURI: { wsURI: {
...@@ -29,8 +30,11 @@ ...@@ -29,8 +30,11 @@
key: '', key: '',
text: '' text: ''
}, },
name: '电力消防综合管控平台' name: '电力消防综合管控平台',
} outMap: false
},
//地图中心点
mapCenter: [106.976608,40.984692]
}; };
// 配置日志系统 // 配置日志系统
var LogConfig = { var LogConfig = {
......
extra/amap/README.md 0 → 100644
View file @ c9a0e3e0
# 高德地图离线API
1. 将整个amap目录拷贝到tomcat/webapps目录下
2. 下载瓦片，将瓦片拷贝到amap/tiles目录下
3. 启动tomcat，访问[http://localhost:8080/amap/index.html](http://localhost:8080/amap/index.html)
备注：
高德地图离线版本version: 1.4.6 <br>
插件下载地址： <br>
http://webapi.amap.com/maps/modules?v=1.4.6&key=YOUR_KEY&vrs=1525262380887&m=AMap.IndoorMap3D <br>
样式表下载地址： <br>
http://vdata.amap.com/style?v=1.4.6&key=YOUR_KEY&mapstyle=normal <br>
图片下载域名： <br>
http://webapi.amap.com <br>
http://vdata.amap.com <br>
extra/amap/WEB-INF/web.xml 0 → 100644
View file @ c9a0e3e0
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
version="3.0">
<display-name>amap</display-name>
<!--CORS 跨域资源访问
<filter>
<filter-name>CorsFilter</filter-name>
<filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
<init-param>
<param-name>cors.allowed.origins</param-name>
<param-value>*</param-value>
</init-param>
<init-param>
<param-name>cors.allowed.methods</param-name>
<param-value>GET,POST,HEAD,OPTIONS,PUT</param-value>
</init-param>
<init-param>
<param-name>cors.allowed.headers</param-name>
<param-value>Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>
</init-param>
<init-param>
<param-name>cors.exposed.headers</param-name>
<param-value>Access-Control-Allow-Origin,Access-Control-Allow-Credentials</param-value>
</init-param>
<init-param>
<param-name>cors.support.credentials</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>cors.preflight.maxage</param-name>
<param-value>10</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>CorsFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
-->
</web-app>
\ No newline at end of file
extra/amap/js/DistrictExplorer.js 0 → 100644
View file @ c9a0e3e0
This diff is collapsed.
extra/amap/js/amap.1.4.6.js 0 → 100644
View file @ c9a0e3e0
This source diff could not be displayed because it is too large. You can view the blob instead.
extra/amap/js/main.1.4.6.js 0 → 100644
View file @ c9a0e3e0
This diff is collapsed.
extra/amap/js/main.js 0 → 100644
View file @ c9a0e3e0
This diff is collapsed.
extra/amap/js/mapUI/lib/SphericalMercator.js 0 → 100644
View file @ c9a0e3e0
AMapUI.define([], function() {
function getScale(level) {
scaleCache[level] || (scaleCache[level] = 256 * Math.pow(2, level));
return scaleCache[level];
}
function project(lnglat) {
var lat = Math.max(Math.min(maxLat, lnglat[1]), -maxLat), x = lnglat[0] * deg2rad, y = lat * deg2rad;
y = Math.log(Math.tan(quadPI + y / 2));
return [ x, y ];
}
function transform(point, scale) {
scale = scale || 1;
var a = half2PI, b = .5, c = -a, d = .5;
return [ scale * (a * point[0] + b), scale * (c * point[1] + d) ];
}
function unproject(point) {
var lng = point[0] * rad2deg, lat = (2 * Math.atan(Math.exp(point[1])) - Math.PI / 2) * rad2deg;
return [ parseFloat(lng.toFixed(6)), parseFloat(lat.toFixed(6)) ];
}
function untransform(point, scale) {
var a = half2PI, b = .5, c = -a, d = .5;
return [ (point[0] / scale - b) / a, (point[1] / scale - d) / c ];
}
function lngLatToPointByScale(lnglat, scale, round) {
var p = transform(project(lnglat), scale);
if (round) {
p[0] = Math.round(p[0]);
p[1] = Math.round(p[1]);
}
return p;
}
function lngLatToPoint(lnglat, level, round) {
return lngLatToPointByScale(lnglat, getScale(level), round);
}
function pointToLngLat(point, level) {
var scale = getScale(level), untransformedPoint = untransform(point, scale);
return unproject(untransformedPoint);
}
function haversineDistance(point1, point2) {
var cos = Math.cos, lat1 = point1[1] * deg2rad, lon1 = point1[0] * deg2rad, lat2 = point2[1] * deg2rad, lon2 = point2[0] * deg2rad, dLat = lat2 - lat1, dLon = lon2 - lon1, a = (1 - cos(dLat) + (1 - cos(dLon)) * cos(lat1) * cos(lat2)) / 2;
return earthDiameter * Math.asin(Math.sqrt(a));
}
var scaleCache = {}, earthDiameter = 12756274, deg2rad = Math.PI / 180, rad2deg = 180 / Math.PI, quadPI = Math.PI / 4, maxLat = 85.0511287798, half2PI = .5 / Math.PI;
return {
haversineDistance: haversineDistance,
getScale: getScale,
lngLatToPointByScale: lngLatToPointByScale,
pointToLngLat: pointToLngLat,
lngLatToPoint: lngLatToPoint
};
});
\ No newline at end of file
extra/amap/js/mapUI/lib/event.js 0 → 100644
View file @ c9a0e3e0
AMapUI.define([ "lib/utils" ], function(utils) {
"use strict";
function Event() {
this.__evHash = {};
}
utils.extend(Event.prototype, {
on: function(ev, listener, priority) {
if (this.__multiCall(ev, listener, this.on)) return this;
if (!ev) return this;
var evHash = this.__evHash;
evHash[ev] || (evHash[ev] = []);
var list = evHash[ev], index = this.__index(list, listener);
if (index < 0) {
"number" != typeof priority && (priority = 10);
for (var inps = list.length, i = 0, len = list.length; i < len; i++) if (priority > list[i].priority) {
inps = i;
break;
}
list.splice(inps, 0, {
listener: listener,
priority: priority
});
}
return this;
},
once: function(ev, listener, priority) {
function oncefunc() {
self.__callListenser(listener, arguments);
self.off(ev, oncefunc);
}
if (this.__multiCall(ev, listener, this.once)) return this;
var self = this;
this.on(ev, oncefunc, priority);
return this;
},
offAll: function() {
for (var ev in this.__evHash) this.off(ev);
this.__evHash = {};
return this;
},
off: function(ev, listener) {
if (this.__multiCall(ev, listener, this.off)) return this;
var evHash = this.__evHash;
if (evHash[ev]) {
var list = evHash[ev];
if ("undefined" == typeof listener) {
var c = list.length;
list.length = 0;
return c;
}
var index = this.__index(list, listener);
if (index >= 0) {
list.splice(index, 1);
return 1;
}
return 0;
}
},
listenerLength: function(ev) {
var evHash = this.__evHash, list = evHash[ev];
return list ? list.length : 0;
},
emit: function(ev) {
var args, list, evHash = this.__evHash, count = 0;
list = evHash[ev];
if (list && list.length) {
args = Array.prototype.slice.call(arguments, 1);
count += this.__callListenerList(list, args);
}
list = evHash["*"];
if (list && list.length) {
args = Array.prototype.slice.call(arguments);
count += this.__callListenerList(list, args);
}
return count;
},
trigger: function(ev) {
var args = Array.prototype.slice.call(arguments, 0);
args.splice(1, 0, {
type: ev,
target: this
});
this.emit.apply(this, args);
},
triggerWithOriginalEvent: function(ev, originalEvent) {
var args = Array.prototype.slice.call(arguments, 0);
args[1] = {
type: ev,
target: originalEvent ? originalEvent.target : this,
originalEvent: originalEvent
};
this.emit.apply(this, args);
},
onDestroy: function(cb, priority) {
this.on("__destroy", cb, priority);
return this;
},
destroy: function() {
if (!this.__destroying) {
this.__destroying = 1;
this.emit("__destroy", this);
this.offAll();
return this;
}
},
__multiCall: function(ev, listener, func) {
if (!ev) return !0;
if (utils.isObject(ev) && "undefined" == typeof listener) {
for (var k in ev) func.call(this, k, ev[k]);
return !0;
}
var evs;
utils.isArray(ev) ? evs = ev : "string" == typeof ev && (evs = ev.split(/[\s,]+/));
if (evs && evs.length > 1) {
for (var i = 0, len = evs.length; i < len; i++) evs[i] && func.call(this, evs[i], listener);
return !0;
}
return !1;
},
__index: function(list, listener) {
for (var index = -1, i = 0, len = list.length; i < len; i++) {
var ele = list[i];
if (ele.listener === listener) {
index = i;
break;
}
}
return index;
},
__callListenser: function(listener, args) {
var func = null, contxt = null;
if ("function" == typeof listener) {
func = listener;
contxt = this;
} else if (2 == listener.length) {
func = listener[1];
contxt = listener[0];
}
return func ? [ 1, func.apply(contxt, args) ] : [ 0, void 0 ];
},
__callListenerList: function(list, args) {
if (!list || !list.length) return 0;
list = [].concat(list);
for (var cres, count = 0, i = 0, len = list.length; i < len; i++) {
cres = this.__callListenser(list[i].listener, args);
count += cres[0];
if (cres[1] === !1) break;
}
return count;
}
});
return Event;
});
\ No newline at end of file
extra/amap/js/mapUI/lib/utils.js 0 → 100644
View file @ c9a0e3e0
AMapUI.define([], function() {
function setLogger(logger) {
logger.debug || (logger.debug = logger.info);
utils.logger = utils.log = logger;
}
var utils, defaultLogger = console, emptyfunc = function() {}, slientLogger = {
log: emptyfunc,
error: emptyfunc,
warn: emptyfunc,
info: emptyfunc,
debug: emptyfunc,
trace: emptyfunc
};
utils = {
slientLogger: slientLogger,
setLogger: setLogger,
mergeArray: function(target, source) {
if (source.length < 1e5) target.push.apply(target, source); else for (var i = 0, len = source.length; i < len; i += 1) target.push(source[i]);
},
setDebugMode: function(on) {
setLogger(on ? defaultLogger : slientLogger);
},
now: Date.now || function() {
return new Date().getTime();
},
bind: function(fn, thisArg) {
return fn.bind ? fn.bind(thisArg) : function() {
return fn.apply(thisArg, arguments);
};
},
domReady: function(callback) {
/complete|loaded|interactive/.test(document.readyState) ? callback() : document.addEventListener("DOMContentLoaded", function() {
callback();
}, !1);
},
forEach: function(array, callback, thisArg) {
if (array.forEach) return array.forEach(callback, thisArg);
for (var i = 0, len = array.length; i < len; i++) callback.call(thisArg, array[i], i);
},
keys: function(obj) {
if (Object.keys) return Object.keys(obj);
var keys = [];
for (var k in obj) obj.hasOwnProperty(k) && keys.push(k);
return keys;
},
map: function(array, callback, thisArg) {
if (array.map) return array.map(callback, thisArg);
for (var newArr = [], i = 0, len = array.length; i < len; i++) newArr[i] = callback.call(thisArg, array[i], i);
return newArr;
},
arrayIndexOf: function(array, searchElement, fromIndex) {
if (array.indexOf) return array.indexOf(searchElement, fromIndex);
var k, o = array, len = o.length >>> 0;
if (0 === len) return -1;
var n = 0 | fromIndex;
if (n >= len) return -1;
k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
for (;k < len; ) {
if (k in o && o[k] === searchElement) return k;
k++;
}
return -1;
},
extend: function(dst) {
dst || (dst = {});
return utils.extendObjs(dst, Array.prototype.slice.call(arguments, 1));
},
nestExtendObjs: function(dst, objs) {
dst || (dst = {});
for (var i = 0, len = objs.length; i < len; i++) {
var source = objs[i];
if (source) for (var prop in source) source.hasOwnProperty(prop) && (utils.isObject(dst[prop]) && utils.isObject(source[prop]) ? dst[prop] = utils.nestExtendObjs({}, [ dst[prop], source[prop] ]) : dst[prop] = source[prop]);
}
return dst;
},
extendObjs: function(dst, objs) {
dst || (dst = {});
for (var i = 0, len = objs.length; i < len; i++) {
var source = objs[i];
if (source) for (var prop in source) source.hasOwnProperty(prop) && (dst[prop] = source[prop]);
}
return dst;
},
subset: function(props) {
var sobj = {};
if (!props || !props.length) return sobj;
this.isArray(props) || (props = [ props ]);
utils.forEach(Array.prototype.slice.call(arguments, 1), function(source) {
if (source) for (var i = 0, len = props.length; i < len; i++) source.hasOwnProperty(props[i]) && (sobj[props[i]] = source[props[i]]);
});
return sobj;
},
isArray: function(obj) {
return Array.isArray ? Array.isArray(obj) : "[object Array]" === Object.prototype.toString.call(obj);
},
isObject: function(obj) {
return "[object Object]" === Object.prototype.toString.call(obj);
},
isFunction: function(obj) {
return "[object Function]" === Object.prototype.toString.call(obj);
},
isNumber: function(obj) {
return "[object Number]" === Object.prototype.toString.call(obj);
},
isString: function(obj) {
return "[object String]" === Object.prototype.toString.call(obj);
},
isHTMLElement: function(n) {
return window["HTMLElement"] || window["Element"] ? n instanceof (window["HTMLElement"] || window["Element"]) : n && "object" == typeof n && 1 === n.nodeType && "string" == typeof n.nodeName;
},
isSVGElement: function(n) {
return window["SVGElement"] && n instanceof window["SVGElement"];
},
isDefined: function(v) {
return "undefined" != typeof v;
},
random: function(length) {
var str = "", chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz", clen = chars.length;
length || (length = 6);
for (var i = 0; i < length; i++) str += chars.charAt(this.randomInt(0, clen - 1));
return str;
},
randomInt: function(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
},
inherit: function(child, parent) {
function Ctor() {
this.constructor = child;
}
for (var key in parent) parent.hasOwnProperty(key) && (child[key] = parent[key]);
Ctor.prototype = parent.prototype;
child.prototype = new Ctor();
child.__super__ = parent.prototype;
return child;
},
trim: function(s) {
return s ? s.trim ? s.trim() : s.replace(/^\s+|\s+$/gm, "") : "";
},
trigger: function(el, evt, detail) {
if (el) {
detail = detail || {};
var e, opt = {
bubbles: !0,
cancelable: !0,
detail: detail
};
if ("undefined" != typeof CustomEvent) {
e = new CustomEvent(evt, opt);
el.dispatchEvent(e);
} else try {
e = document.createEvent("CustomEvent");
e.initCustomEvent(evt, !0, !0, detail);
el.dispatchEvent(e);
} catch (exp) {
this.log.error(exp);
}
return !0;
}
this.log.error("emply element passed in");
},
nextTick: function(f) {
("object" == typeof process && process.nextTick ? process.nextTick : function(task) {
setTimeout(task, 0);
})(f);
},
removeFromArray: function(arr, val) {
var index = arr.indexOf(val);
index > -1 && arr.splice(index, 1);
return index;
},
debounce: function(func, wait, immediate) {
var timeout, args, context, timestamp, result, later = function() {
var last = utils.now() - timestamp;
if (last < wait && last >= 0) timeout = setTimeout(later, wait - last); else {
timeout = null;
if (!immediate) {
result = func.apply(context, args);
timeout || (context = args = null);
}
}
};
return function() {
context = this;
args = arguments;
timestamp = utils.now();
var callNow = immediate && !timeout;
timeout || (timeout = setTimeout(later, wait));
if (callNow) {
result = func.apply(context, args);
context = args = null;
}
return result;
};
},
throttle: function(func, wait, options) {
var context, args, result, timeout = null, previous = 0;
options || (options = {});
var later = function() {
previous = options.leading === !1 ? 0 : utils.now();
timeout = null;
result = func.apply(context, args);
timeout || (context = args = null);
};
return function() {
var now = utils.now();
previous || options.leading !== !1 || (previous = now);
var remaining = wait - (now - previous);
context = this;
args = arguments;
if (remaining <= 0 || remaining > wait) {
if (timeout) {
clearTimeout(timeout);
timeout = null;
}
previous = now;
result = func.apply(context, args);
timeout || (context = args = null);
} else timeout || options.trailing === !1 || (timeout = setTimeout(later, remaining));
return result;
};
},
ucfirst: function(string) {
return string.charAt(0).toUpperCase() + string.slice(1);
},
escapeHtml: function(text) {
var map = {
"&": "&amp;",
"<": "&lt;",
">": "&gt;",
'"': "&quot;",
"'": "&#x27;",
"`": "&#x60;"
};
return (text + "").replace(/[&<>"']/g, function(m) {
return map[m];
});
}
};
utils.setDebugMode(!1);
return utils;
});
\ No newline at end of file
extra/amap/js/mapUI/ui/geo/DistrictExplorer.js 0 → 100644
View file @ c9a0e3e0
This diff is collapsed.
extra/amap/js/outamap.1.4.6.js 0 → 100644
View file @ c9a0e3e0
This source diff could not be displayed because it is too large. You can view the blob instead.
extra/amap/js/outmain.1.4.6.js 0 → 100644
View file @ c9a0e3e0
This source diff could not be displayed because it is too large. You can view the blob instead.
extra/amap/js/plugins.js 0 → 100644
View file @ c9a0e3e0
This source diff could not be displayed because it is too large. You can view the blob instead.
extra/amap/load.js 0 → 100644
View file @ c9a0e3e0
localStorage.clear();
window.offlineMap = {
}
var scripts = document.getElementsByTagName("script");
var curScript = scripts[scripts.length - 1].getAttribute("src");
offlineMap.baseUrl = curScript.substr(0, curScript.lastIndexOf("/")+1);
offlineMap.domain = offlineMap.baseUrl.substr(offlineMap.baseUrl.indexOf("://"), offlineMap.baseUrl.length);
document.write('<script type="text/javascript" src="' + offlineMap.baseUrl + 'js/amap.1.4.6.js?rnd= ' + Math.random() + '"></script>');
extra/amap/style/normalStyle.css 0 → 100644
View file @ c9a0e3e0
This source diff could not be displayed because it is too large. You can view the blob instead.
src/_mock/mapData.js 0 → 100644
View file @ c9a0e3e0
const mapData = [
{"id": 1, "name":"安徽电科院", "aliasName": ["安徽电科院","安徽电科院"], "lng":121.96196, "lat":41.971998, "path": [{lng:122.577194, lat:42.069939},{lng:122.577194, lat:42.069939}], "pathName": "", "gradient":0, "width":220, "height":8, "position":"left", "status":1, "type": "center"},
{"id": 2, "name":"苏州换流站", "aliasName": ["苏州换流站","沂南换流站"], "lng":125.917038, "lat":41.414152, "path": [{lng:125.917038, lat:41.414152},{lng:122.577194, lat:42.069939}], "pathName": "", "gradient": 75, "width":125, "height":8, "position":"right", "status":1, "type": "endmost"},
{"id": 3, "name":"宜宾换流站", "aliasName": ["宜宾换流站","武汉换流站"], "lng":107.32817, "lat":38.792894, "path": [{lng:107.32817, lat:38.792894},{lng:122.577194, lat:42.069939}], "pathName": "昭沂直流", "gradient":-15, "width":185, "height":8, "position":"left", "status":1, "type": "endmost"},
{"id": 4, "name":"陕北换流站", "aliasName": ["陕北换流站","沂南换流站"], "lng":113.216842, "lat":45.679559, "path": [{lng:113.216842, lat:45.679559},{lng:122.577194, lat:42.069939}], "pathName": "昭沂直流", "gradient":10, "width":110, "height":8, "position":"left", "status":2, "type": "endmost"},
{"id": 5, "name":"武汉换流站", "aliasName": ["武汉换流站","沂南换流站"], "lng":119.720749, "lat":40.216897, "path": [{lng:119.720749, lat:40.216897},{lng:122.577194, lat:42.069939}], "pathName": "", "gradient":0, "width":125, "height":8, "position":"left", "status":1, "type": "endmost"},
{"id": 6, "name":"复龙换流站", "aliasName": ["复龙换流站","沂南换流站"], "lng":104.779342, "lat":38.690065, "path": [{lng:104.779342, lat:38.690065},{lng:122.577194, lat:42.069939}], "pathName": "", "gradient":0, "width":125, "height":8, "position":"left", "status":1, "type": "endmost"},
{"id": 7, "name":"金华换流站", "aliasName": ["金华换流站","沂南换流站"], "lng":127.103561, "lat":38.998107, "path": [{lng:127.103561, lat:38.998107},{lng:122.577194, lat:42.069939}], "pathName": "", "gradient":0, "width":125, "height":8, "position":"right", "status":1, "type": "endmost"},
{"id": 8, "name":"中州换流站", "aliasName": ["中州换流站","沂南换流站"], "lng":118.49028, "lat":43.933752, "path": [{lng:118.49028, lat:43.933752},{lng:122.577194, lat:42.069939}], "pathName": "", "gradient":0, "width":125, "height":8, "position":"left", "status":1, "type": "endmost"},
{"id": 9, "name":"龙泉换流站", "aliasName": ["龙泉换流站","沂南换流站"], "lng":103.548874, "lat":39.032252, "path": [{lng:103.548874, lat:39.032252},{lng:122.577194, lat:42.069939}], "pathName": "", "gradient":0, "width":125, "height":8, "position":"left", "status":1, "type": "endmost"},
{"id": 10, "name":"驻马店换流站", "aliasName": ["驻马店换流站","沂南换流站"], "lng":119.061569, "lat":42.460193, "path": [{lng:119.061569, lat:42.460193},{lng:122.577194, lat:42.069939}], "pathName": "", "gradient":0, "width":125, "height":8, "position":"left", "status":1, "type": "endmost"},
{"id": 11, "name":"伊克昭换流站", "aliasName": ["伊克昭换流站","沂南换流站"], "lng":110.14067, "lat":45.832865, "path": [{lng:110.14067, lat:45.832865},{lng:122.577194, lat:42.069939}], "pathName": "昭沂直流", "gradient":10, "width":180, "height":8, "position":"left", "status":3, "type": "endmost"},
{"id": 12, "name":"沂南换流站", "aliasName": ["伊克昭换流站","沂南换流站"], "lng":122.489303, "lat":44.750877, "path": [{lng:122.489303, lat:44.750877},{lng:122.577194, lat:42.069939}], "pathName": "", "gradient":30, "width":220, "height":8, "position":"left", "status":1, "type": "endmost"},
];
export default mapData;
src/consts/imgStatic.js 0 → 100644
View file @ c9a0e3e0
export default {
mapIcon: {
logo: require('./../assets/map/logo.png'),
center_1: require('./../assets/map/maker-center.png'),
endmost_1: require('./../assets/map/endmost-1.png'),
endmost_2: require('./../assets/map/endmost-2.png'),
endmost_3: require('./../assets/map/endmost-3.png'),
endmost_title_1: require('./../assets/map/endmost-title-1.png'),
endmost_title_2: require('./../assets/map/endmost-title-2.png'),
endmost_title_3: require('./../assets/map/endmost-title-3.png'),
loading: require('./../assets/map/loading.png'),
alias_line: require('./../assets/map/alias-line.png'),
alias_title: require('./../assets/map/alias-title.png')
}
};
src/consts/urlConsts.js
View file @ c9a0e3e0
...@@ -22,4 +22,7 @@ export const OltSerUrl = { ...@@ -22,4 +22,7 @@ export const OltSerUrl = {
}; };
export const loginURI = endConf.loginURI; export const loginURI = endConf.loginURI;
export const sysName = AmosConfig.sysConf.name; export const sysName = AmosConfig.sysConf.name;
export const _mapCenter = AmosConfig.mapCenter;
export const _picURI = AmosConfig.httpURI.picURI;
export const outMap = AmosConfig.sysConf.outMap;
export default OltSerUrl; export default OltSerUrl;
src/styles/view/monitor/index.scss
View file @ c9a0e3e0
@import './duty.scss'; @import './duty.scss';
@import './map.scss';
.view-root { .view-root {
height: 100%; height: 100%;
background: url('/src/assets/bg/bg.png') no-repeat; background: url('/src/assets/bg/bg.png') no-repeat;
......
src/styles/view/monitor/map.scss 0 → 100644
View file @ c9a0e3e0
.map-root {
width: 100%;
height: 100%;
.map {
width: 1750px;
height: 1000px;
}
.marker-icon {
margin-top: -10px;
margin-left: -12px;
}
.marker-center {
margin-top: 3px;
}
.input-card {
position: absolute;
top: 1px;
right: 15px;
}
.title {
position: absolute;
margin-left: -40px;
margin-top: -35px;
text-align: center;
span {
position: absolute;
width: 100%;
height: 20px;
font-size: 15px;
font-family: Microsoft YaHei;
line-height: 40px;
color: rgba(255, 255, 255, 1);
}
}
.loading {
position: absolute;
top: 100px;
left: 850px;
z-index: 1;
width: 155px;
text-align: center;
span {
font-size: 15px;
font-family: Microsoft YaHei;
line-height: 20px;
color: rgba(255, 255, 255, 1);
padding-left: 15px;
}
}
.content-alias {
position: absolute;
text-align: center;
height: 1px;
margin-left: 60px;
.alias-title {
width: 90px;
margin-top: -32px;
}
span {
position: absolute;
float: left;
left: 1px;
margin-top: -30px;
font-size: 15px;
font-family: Microsoft YaHei;
color: #fe0000;
}
}
.content-alarm {
position: absolute;
height: 120px;
bottom: 0px;
left: 22%;
z-index: 1;
.row-2 {
height: 35px;
span {
font-size: 15px;
font-family: Microsoft YaHei;
color: rgba(252, 244, 23, 1);
}
}
.row-3 {
height: 35px;
span {
font-size: 15px;
font-family: Microsoft YaHei;
color: #fe0000;
}
}
.right {
margin-left: 15px;
}
}
.content-explain {
position: absolute;
bottom: 50px;
right: 23%;
.row {
height: 35px;
}
.fault {
float: left;
width: 20px;
height: 20px;
background: rgba(235, 33, 6, 1);
border-radius: 50%;
opacity: 1;
}
.alarm {
float: left;
width: 20px;
height: 20px;
background: rgba(252, 244, 23, 1);
border-radius: 50%;
opacity: 1;
}
.normal {
float: left;
width: 20px;
height: 20px;
background: rgba(69, 255, 4, 1);
border-radius: 50%;
opacity: 1;
}
span {
float: left;
padding-left: 15px;
margin-top: -5px;
font-size: 15px;
font-family: Microsoft YaHei;
color: rgba(255, 255, 255, 1);
}
}
}
src/view/monitor/index.js
View file @ c9a0e3e0
...@@ -3,6 +3,8 @@ import PropTypes from 'prop-types'; ...@@ -3,6 +3,8 @@ import PropTypes from 'prop-types';
import { sessionConsts } from '../../consts/storageConsts'; import { sessionConsts } from '../../consts/storageConsts';
import { Store } from 'amos-tool'; import { Store } from 'amos-tool';
import Header from './../main/header'; import Header from './../main/header';
import loadScripts from 'dt2react/lib/utils/loadScripts';
import { outMap } from './../../consts/urlConsts';
const lsTool = Store.lsTool; const lsTool = Store.lsTool;
...@@ -17,7 +19,9 @@ class RootView extends Component { ...@@ -17,7 +19,9 @@ class RootView extends Component {
super(props); super(props);
this.state = { this.state = {
submenu: [], submenu: [],
extendSystem: [] extendSystem: [],
loadAmap: false,
BasicMap: null
}; };
} }
...@@ -27,7 +31,42 @@ class RootView extends Component { ...@@ -27,7 +31,42 @@ class RootView extends Component {
} }
componentDidMount() { componentDidMount() {
if (outMap) {
Object.keys(localStorage).map(e => {
if (e.indexOf('_AMap') === 0) {
localStorage.removeItem(e);
}
});
let script = null;
let mainUI = null;
script = {
key: 'amapscripts',
//url: `//172.16.3.121:8085/extra/amap/js/outamap.1.4.6.js?rnd= ${Math.random()}`
url: `/extra/amap/js/outamap.1.4.6.js?rnd= ${Math.random()}`
};
mainUI = {
key: 'mainUI',
//url: '//10.56.28.228/webapi.amap.com/ui/1.0/main.js'
url: '/extra/amap/js/outmain.1.4.6.js'
};
loadScripts.asyncLoadScript(script, () => {
loadScripts.asyncLoadScript(mainUI, () => {
setTimeout(() => {
this.setState({
loadAmap: true,
BasicMap: require('./mapScreen/BasicMap')
});
}, 2000);
});
});
} else {
this.setState({
loadAmap: true,
BasicMap: require('./mapScreen/BasicMap')
});
}
} }
componentWillUnmount() { componentWillUnmount() {
...@@ -35,6 +74,7 @@ class RootView extends Component { ...@@ -35,6 +74,7 @@ class RootView extends Component {
} }
render() { render() {
const { children } = this.props; const { children } = this.props;
let BasicMap = this.state.BasicMap;
return ( return (
<div className="view-root"> <div className="view-root">
<div className="header"> <div className="header">
...@@ -42,6 +82,7 @@ class RootView extends Component { ...@@ -42,6 +82,7 @@ class RootView extends Component {
</div> </div>
<div className="content-body"> <div className="content-body">
{children} {children}
{ this.state.loadAmap && <BasicMap />}
</div> </div>
</div> </div>
); );
......
src/view/monitor/mapScreen/BasicMap.js 0 → 100644
View file @ c9a0e3e0
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { BaseMap, Marker, Polyline, Circle } from 'amos-amap';
import { _picURI, _mapCenter } from './../../../consts/urlConsts';
import imgStatic from './../../../consts/imgStatic';
import mapData from './../../../_mock/mapData';
import { getIcon } from './conf';
import { up } from './conf';
import { utils } from 'amos-tool';
import { outMap } from './../../../consts/urlConsts';
const mapIcon = imgStatic.mapIcon;
const showZoom = 5;
const mapConfig = {
zoom: showZoom,
resizeEnable: true,
zoomEnable: true,
// plugins: ['Scale', 'MapType', 'OverView', 'ControlBar'],
plugins: ['Scale'],
zooms: [showZoom, showZoom],
expandZoomRange: true,
doubleClickZoom: false,
showIndoorMap: false, //隐藏地图自带的室内地图图层
features: ['bg', 'road', 'point'], //隐藏默认楼块
layers: [
new AMap.TileLayer({
getTileUrl(x, y, z) {
return `${_picURI}china/amap/${z}/${x}/${y}.png`;
},
zIndex: 0
})
]
};
const layers = [
// console.log(window);
// new window.AMap.TileLayer({
// getTileUrl(x, y, z) {
// return `${_picURI}shanxi/amap/${z}/${x}/${y}.png`;
// },
// zIndex: 0
// })
]
const statusEnum = { '2': '告警', '3': '高风险' };
/**
* 地图首页
*
* @class BasicMap
* @extends {Basic}
*/
class BasicMap extends Component {
constructor(props) {
super(props);
this.state = {
mapCenter: _mapCenter,
lineStyle: { strokeColor: '#1B950D', fillColor: '#1B950D', strokeWeight: '2' },
alarmList: [],
visible: false,
selectData: {}
};
this.layers = [];
}
componentDidMount(){
this.initData();
}
initData = () => {
let temp = [];
mapData.map(item => {
if (item.status !== 1){
temp.push(item);
}
});
temp.reverse(up);
this.setState({
alarmList: temp
});
}
initMap = () => {
window.map.on('click', function(e) {
document.getElementById("lnglat").value = e.lnglat.getLng() + ',' + e.lnglat.getLat()
});
};
onClick = (e) =>{
let visibleList = e.aliasName;
let num = 0;
let temp = {};
mapData.map(item => {
if (visibleList.includes(item.name)){
num = num + 1;
item.title = true;
if (num === 1 ){
temp = item;
}
} else {
item.title = false;
}
});
this.setState({
visible: true,
selectData: temp
});
setTimeout(()=>{
this.setState({
visible: false
});
},500);
}
renderAliasLine = (e) => {
let { selectData } = this.state;
let divStyle = {
marginTop: '-11px',
transform: `rotate(${selectData.gradient}deg)`
};
if (selectData.gradient <= 0){
divStyle.marginTop = '-50px';
}
if (selectData.position === 'right'){
divStyle.right = '0px';
}
if (selectData.pathName){
return (
<Marker key={selectData.id} zIndex={1} position={{ longitude: selectData.lng, latitude: selectData.lat }}>
<div className={`content-alias`} style={divStyle}>
<img src={mapIcon.alias_line} style={{ width: `${selectData.width}px`, height: `${selectData.height}px` }}></img>
<img src={mapIcon.alias_title} className='alias-title'></img>
<span style={{ width: `${selectData.width}px` }}>{selectData.pathName}</span>
</div>
</Marker>
);
}
}
/**
* 设置末端marker
*
* @memberof BasicMap
*/
setBodyMarker = () => {
let { aliasName } = this.state;
return (mapData || []).map((item, index) => {
if (item.type === 'center') {
return (<Marker key={item.id} zIndex={1} position={{ longitude: item.lng, latitude: item.lat }}>
<div className={`marker-center`}>
<div className='title'>
<span>{item.name}</span>
<img src={mapIcon.endmost_title_2} />
</div>
<img src={getIcon(item.type, item.status)}></img>
</div>
</Marker>);
} else {
return (<Marker key={item.id} zIndex={1} position={{ longitude: item.lng, latitude: item.lat }}>
<div className={`marker-icon`}>
{ item.title && <div className='title'>
<span>{item.name}</span>
<img src={getIcon(item.type, 'title_' + item.status)} />
</div>}
<img src={getIcon(item.type, item.status)} onClick={() => this.onClick(item)}></img>
</div>
</Marker>);
}
});
};
/**
* 设置连线
*
* @memberof BasicMap
*/
setBodyLine = () => {
let { lineStyle } = this.state;
return (mapData || []).map((item, index) => {
if (item) {
return ( <Polyline
key={item.id}
zIndex={11}
path={item.path}
events={this.lineEvents}
style={lineStyle}
extData={item}
/>);
}
});
};
buildAlarm = () => {
let { alarmList } = this.state;
return (alarmList || []).map((item, index) => {
if (item) {
return (<div className={`row-${item.status}`} key={index}>
<span>{item.name}</span>
<span className='right'>{statusEnum[item.status]}</span>
</div>);
}
});
}
buildExplain = () => {
return (
<div className='content-explain'>
<div className='row'>
<div className='fault'></div>
<span>高风险</span>
</div>
<div className='row'>
<div className='alarm'></div>
<span>告警</span>
</div>
<div className='row'>
<div className='normal'></div>
<span>安全</span>
</div>
</div>
);
}
setInstanceToGlobal = inst => {
console.log(inst);
this.map = inst;
window.map = inst;
//this.initMap();
// this.layers = [
// new AMap.TileLayer({
// getTileUrl(x, y, z) {
// return `${_picURI}shanxi/amap/${z}/${x}/${y}.png`;
// },
// zIndex: 0
// })
// ];
// console.log(this.layers);
};
render() {
const events = {
created: this.setInstanceToGlobal
};
if (outMap) {
mapConfig.layers = this.layers;
}
let { mapCenter, visible } = this.state;
return (
<div className="map-root">
<div className='content-alarm'>
{this.buildAlarm()}
</div>
{visible && <div className='loading'>
<img src={mapIcon.loading}></img>
<span>数据更新完毕！</span>
</div>}
<div className='map'>
<BaseMap events={events}
useAMapUI
center={mapCenter}
{...mapConfig}
dragEnable={false}
// layers={this.layers}
>
{this.setBodyMarker()}
{this.setBodyLine()}
{this.renderAliasLine()}
</BaseMap>
</div>
{this.buildExplain()}
{/* <div className="input-card">
<div>
<input type="text" id="lnglat"></input>
</div>
</div> */}
</div>
);
}
}
BasicMap.propTypes = {
};
export default BasicMap;
src/view/monitor/mapScreen/conf.js 0 → 100644
View file @ c9a0e3e0
import imgStatic from './../../../consts/imgStatic';
const mapIcon = imgStatic.mapIcon;
export const up = (x,y) => {
return y.status - x.status;
};
export const getIcon = (type, status) => {
return mapIcon[`${type}_${status}`];
};
src/view/monitor/mapScreen/index.js 0 → 100644
View file @ c9a0e3e0
import React, { Component } from 'react';
import PropTypes from 'prop-types';
/**
* MapScreen
* 地图
* @class MapScreen
* @extends {Component}
*/
class MapScreen extends Component {
constructor(props) {
super(props);
this.state = {
};
}
componentWillMount() {
}
componentDidMount() {
}
componentWillUnmount() {
}
render() {
return (
<div className="map-root">
</div>
);
}
}
MapScreen.propTypes = {
};
export default MapScreen;
tpl.html
View file @ c9a0e3e0
...@@ -7,7 +7,18 @@ ...@@ -7,7 +7,18 @@
<meta name="renderer" content="webkit"> <meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="application/javascript" src="/amos.config.js"></script> <script type="application/javascript" src="/amos.config.js"></script>
<script src="http://webapi.amap.com/maps?v=1.4.3&key=8afbcd8006fcd36a22136ef20a12456a"></script>
<script src="http://webapi.amap.com/ui/1.0/main.js?v=1.0.11"></script>
<title>电力消防综合管控平台</title> <title>电力消防综合管控平台</title>
<script>
window.offlineMap = {
}
var scripts = document.getElementsByTagName("script");
var curScript = scripts[0].getAttribute("src");
offlineMap.baseUrl = window.location.origin + '/';
offlineMap.domain = offlineMap.baseUrl.substr(offlineMap.baseUrl.indexOf("://"), offlineMap.baseUrl.length);
</script>
<style> <style>
.startload { .startload {
position: fixed; position: fixed;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment