@vtx/cs-map
Version:
React components for Vortex
409 lines (372 loc) • 15.8 kB
JavaScript
;
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _cesium = require("cesium");
var _CockpitIcon = _interopRequireDefault(require("@vtx/map-icon/lib/map-icon/CockpitIcon"));
var _FeatureLayer2 = _interopRequireDefault(require("../feature-layer/FeatureLayer"));
var _createFeatureCollection = require("../feature-layer/createFeatureCollection");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
function _possibleConstructorReturn(t, e) { if (e && ("object" == _typeof(e) || "function" == typeof e)) return e; if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined"); return _assertThisInitialized(t); }
function _assertThisInitialized(e) { if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return e; }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
function _superPropGet(t, o, e, r) { var p = _get(_getPrototypeOf(1 & r ? t.prototype : t), o, e); return 2 & r && "function" == typeof p ? function (t) { return p.apply(e, t); } : p; }
function _get() { return _get = "undefined" != typeof Reflect && Reflect.get ? Reflect.get.bind() : function (e, t, r) { var p = _superPropBase(e, t); if (p) { var n = Object.getOwnPropertyDescriptor(p, t); return n.get ? n.get.call(arguments.length < 3 ? e : r) : n.value; } }, _get.apply(null, arguments); }
function _inherits(t, e) { if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function"); t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && _setPrototypeOf(t, e); }
function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
function _superPropSet(t, e, o, r, p, f) { return _set(_getPrototypeOf(f ? t.prototype : t), e, o, r, p); }
function set(e, r, t, o) { return set = "undefined" != typeof Reflect && Reflect.set ? Reflect.set : function (e, r, t, o) { var f, i = _superPropBase(e, r); if (i) { if ((f = Object.getOwnPropertyDescriptor(i, r)).set) return f.set.call(o, t), !0; if (!f.writable) return !1; } if (f = Object.getOwnPropertyDescriptor(o, r)) { if (!f.writable) return !1; f.value = t, Object.defineProperty(o, r, f); } else _defineProperty(o, r, t); return !0; }, set(e, r, t, o); }
function _set(e, r, t, o, f) { if (!set(e, r, t, o || e) && f) throw new TypeError("failed to set property"); return t; }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
function _superPropBase(t, o) { for (; !{}.hasOwnProperty.call(t, o) && null !== (t = _getPrototypeOf(t));); return t; }
function _getPrototypeOf(t) { return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) { return t.__proto__ || Object.getPrototypeOf(t); }, _getPrototypeOf(t); }
var DemandLayer = /*#__PURE__*/function (_FeatureLayer) {
function DemandLayer(opt_options) {
var _this2;
_classCallCheck(this, DemandLayer);
var options = opt_options || {};
var url = options.url,
params = options.params,
data = options.data,
key = options.key,
name = options.name,
labelField = options.labelField,
template = options.template,
autoRefresh = options.autoRefresh,
method = options.method,
renderMode = options.renderMode,
style = options.style,
_options$show = options.show,
show = _options$show === void 0 ? true : _options$show,
legend = options.legend,
group = options.group,
map = options.map;
if (group !== null && group !== void 0 && group.length) {
if (!show) {
group.map(function (f) {
f.show = false;
});
} else {
group.map(function (f) {
var _f$show;
f.show = (_f$show = f.show) !== null && _f$show !== void 0 ? _f$show : true;
});
}
}
_this2 = _callSuper(this, DemandLayer, [options]);
_superPropSet((_this2, DemandLayer), "show", show, _this2, 1, 1);
// 接口地址
_this2.url = url;
// 接口地址请求类型
_this2.method = method;
// 接口查询参数
_this2.params = params;
// 图层标识
_this2.key = key;
// 图层名称
_this2.name = name;
// 渲染
_this2.style = style;
// 标签字段
_this2.labelField = labelField;
// 自动刷新标识
_this2.autoRefresh = autoRefresh;
// 模版内容
_this2.template = template;
// 渲染模式
_this2.renderMode = renderMode || 'marker';
// 图例
_this2.legend = legend;
// 过滤
_this2.group = group;
// 地图
_this2.map = map;
// 是否存在地址
if (url) {
// 执行
_this2.loadUrlData(url, params, method);
}
// 直接加载数据
if (data) {
// 执行
_this2.loadData(data);
}
return _this2;
}
// 重写父类的属性访问器
_inherits(DemandLayer, _FeatureLayer);
return _createClass(DemandLayer, [{
key: "show",
get: function get() {
return _superPropGet(DemandLayer, "show", this, 1);
},
set: function set(value) {
this.setVisible(value);
}
// 获取地图
}, {
key: "getMap",
value: function getMap() {
return this.map;
}
// 根据条件获取图形数据
}, {
key: "getFeatureByFieldValue",
value: function getFeatureByFieldValue(field, value) {
return this.getSource().getFeatures().find(function (v) {
return v.values_[field] === value;
});
}
// 获取当前图层的所有图形
}, {
key: "getFeatures",
value: function getFeatures() {
return this.entities.values;
}
// 设置图层显示隐藏
}, {
key: "setVisible",
value: function setVisible(visible) {
_superPropSet(DemandLayer, "show", visible, this, 1, 1); // 将属性传递给父类
var map = this.getMap && this.getMap();
if (map) {
map.layers.emit('visible', this, visible);
}
}
// 设置过滤条件
}, {
key: "setGroup",
value: function setGroup(group) {
var features = this.getFeatures();
var map = this.getMap && this.getMap();
if (group !== null && group !== void 0 && group.length && features !== null && features !== void 0 && features.length) {
features.map(function (feature) {
var show = false;
group.map(function (v) {
if (!v.hasOwnProperty('show') || v.show) {
var properties = map.getProperties(feature);
if (v.filter(properties)) {
show = true;
}
}
});
feature.show = show;
});
this.group = group;
this.setVisibleByGroup();
}
}
// 根据过滤条件组显示图层
}, {
key: "setVisibleByGroup",
value: function setVisibleByGroup() {
var group = this.group;
if (group !== null && group !== void 0 && group.length) {
var visible = false;
group.map(function (v) {
if (!v.hasOwnProperty('show') || v.show) {
visible = true;
}
});
this.setVisible(visible);
}
}
// 设置渲染模式
}, {
key: "setRenderMode",
value: function setRenderMode(renderMode) {
this.hideClustering();
// 展示聚合时设置样式为 marker 并且开启聚合监听
if (renderMode === 'clustering') {
this.renderMode = 'marker';
this.setStyle();
this.showClustering();
} else {
this.renderMode = renderMode;
this.setStyle();
}
}
// 自动刷新
}, {
key: "refresh",
value: function refresh() {
(0, _createFeatureCollection.getDataByHttp)(this.url, this.params, this.method).then(function (res) {
var _res$features;
if (res !== null && res !== void 0 && (_res$features = res.features) !== null && _res$features !== void 0 && _res$features.length) {}
});
}
// 加载数据
}, {
key: "loadData",
value: function loadData(data) {
this.entities.removeAll();
var geoJsonData = (0, _createFeatureCollection.createFeatureCollection)(Array.isArray(data) ? data : [data]);
this.render(geoJsonData);
}
// 加载接口数据
}, {
key: "loadUrlData",
value: function loadUrlData(url, params, method) {
var _this3 = this;
this.entities.removeAll();
(0, _createFeatureCollection.getDataByHttp)(url, params, method).then(function (res) {
var _res$features2;
if (res !== null && res !== void 0 && (_res$features2 = res.features) !== null && _res$features2 !== void 0 && _res$features2.length) {
_this3.render(res);
}
});
}
// 加载图形数据
}, {
key: "loadFeatures",
value: function loadFeatures(features) {
this.entities.removeAll();
this.getSource().addFeatures(features);
}
// 渲染
}, {
key: "render",
value: function render(geoJsonData) {
var _this4 = this;
if (geoJsonData) {
var group = this.group;
var features = geoJsonData.features;
features.map(function (v) {
var entity = createFeature(v);
if (entity) {
var _this4$group, _style, _style2;
var show = true;
var style = _this4.style;
// 针对过滤时的处理
if ((_this4$group = _this4.group) !== null && _this4$group !== void 0 && _this4$group.length) {
show = false;
group.map(function (f) {
if (f.filter(v.properties)) {
style = f.style;
if (!f.hasOwnProperty('show') || f.show) {
show = true;
}
}
});
}
setRenderer(entity, style);
if (((_style = style) === null || _style === void 0 ? void 0 : _style.type) === 'Marker' && (_style2 = style) !== null && _style2 !== void 0 && _style2.style) {
var _style$style = style.style,
image = _style$style.image,
imageType = _style$style.imageType,
imageKey = _style$style.imageKey;
if (image && imageType) {
if (imageType === 'gif') {
entity.setGifImage(image, imageKey);
}
}
}
entity.show = show;
entity.type = _this4.modalType || _this4.key;
entity.key = _this4.key;
entity.properties = v.properties || {};
_this4.entities.add(entity);
}
});
}
}
// 设置样式
}, {
key: "setStyle",
value: function setStyle() {
var _this5 = this;
if (this.renderMode === 'point') {
this.entities.values.map(function (entity) {
setRenderer(entity, {
type: 'Marker',
style: {
type: 'PointIcon',
size: 15
}
});
});
} else {
this.entities.values.map(function (entity) {
setRenderer(entity, _this5.style);
});
}
}
// 展示聚合
}, {
key: "showClustering",
value: function showClustering() {
// 是否聚合
this.customStyle();
this.clustering.pixelRange = 100;
this.clustering.minimumClusterSize = 2;
this.clustering.enabled = true;
}
// 隐藏聚合
}, {
key: "hideClustering",
value: function hideClustering() {
this.clustering.enabled = false;
if ((0, _cesium.defined)(this.removeListener) && this.removeListener) {
this.removeListener();
this.removeListener = undefined;
}
}
// 自定义样式
}, {
key: "customStyle",
value: function customStyle() {
var _this = this;
if ((0, _cesium.defined)(this.removeListener) && this.removeListener) {
this.removeListener();
this.removeListener = undefined;
} else {
this.removeListener = this.clustering.clusterEvent.addEventListener(function (clusteredEntities, cluster) {
cluster.label.show = false;
cluster.billboard.show = true;
cluster.billboard.id = cluster.label.id;
cluster.billboard.verticalOrigin = _cesium.VerticalOrigin.BOTTOM;
cluster.billboard.heightReference = _cesium.HeightReference.CLAMP_TO_GROUND;
cluster.billboard.horizontalOrigin = _cesium.HorizontalOrigin.CENTER;
cluster.billboard.disableDepthTestDistance = 10000;
var text = clusteredEntities.length;
var color = 'rgb(9,220,107)';
if (clusteredEntities.length >= 50) {
text = '50+';
color = 'rgb(220,33,9)';
} else if (clusteredEntities.length >= 40) {
text = '40+';
color = 'rgb(232,119,5)';
} else if (clusteredEntities.length >= 30) {
text = '30+';
color = 'rgb(232,194,4)';
} else if (clusteredEntities.length >= 20) {
text = '20+';
color = 'rgba(20, 232, 4, 1)';
} else if (clusteredEntities.length >= 10) {
text = '10+';
color = 'rgb(0,128,255)';
}
cluster.billboard.image = new _CockpitIcon["default"]({
canvasIcon: _this.style,
color: color,
hideFooter: true,
info: [{
text: text,
fontSize: 24
}]
}).getImgUrl();
});
}
}
}]);
}(_FeatureLayer2["default"]);
var _default = exports["default"] = DemandLayer;
//# sourceMappingURL=DemandLayer.js.map