diff --git a/04.系统编码/.vs/BeijingSafeguard/v15/.suo b/04.系统编码/.vs/BeijingSafeguard/v15/.suo
index d00f436..f9b5085 100644
Binary files a/04.系统编码/.vs/BeijingSafeguard/v15/.suo and b/04.系统编码/.vs/BeijingSafeguard/v15/.suo differ
diff --git a/04.系统编码/.vs/BeijingSafeguard/v15/Server/sqlite3/storage.ide-wal b/04.系统编码/.vs/BeijingSafeguard/v15/Server/sqlite3/storage.ide-wal
index 2071b1e..08ca39b 100644
Binary files a/04.系统编码/.vs/BeijingSafeguard/v15/Server/sqlite3/storage.ide-wal and b/04.系统编码/.vs/BeijingSafeguard/v15/Server/sqlite3/storage.ide-wal differ
diff --git a/04.系统编码/App/App.csproj b/04.系统编码/App/App.csproj
index 1f640a6..4396783 100644
--- a/04.系统编码/App/App.csproj
+++ b/04.系统编码/App/App.csproj
@@ -205,6 +205,7 @@
+
diff --git a/04.系统编码/App/Content/scripts/beijing/map.js b/04.系统编码/App/Content/scripts/beijing/map.js
index ee64c45..3a356ef 100644
--- a/04.系统编码/App/Content/scripts/beijing/map.js
+++ b/04.系统编码/App/Content/scripts/beijing/map.js
@@ -97,7 +97,9 @@ var Map = function (parent) {
L.tileLayer.gaodeOther().addTo(this.map);
$('.leaflet-control-attribution').hide();
- this.map.on('mousemove', this.OnMapMove.bind(this))
+
+ $('.latlng').text('当前经纬度:{0}, {1}'.format(this.getLatLng(116.400000000), this.getLatLng(39.90000000)));
+ this.map.on('mousemove', this.OnMapMove.bind(this));
};
this.CenterMap = function (lat, lng) {
diff --git a/04.系统编码/App/Content/scripts/menggu/info-point.js b/04.系统编码/App/Content/scripts/menggu/info-point.js
new file mode 100644
index 0000000..8e1f137
--- /dev/null
+++ b/04.系统编码/App/Content/scripts/menggu/info-point.js
@@ -0,0 +1,60 @@
+var InfoPoint = function (parent) {
+ this.Parent = parent;
+ this.Point = null;
+
+ this.Startup = function () {
+ $('.icon-view .icon-col').on('click', this.OnColClick.bind(this));
+ $('#close-info-dialog').on('click', this.HideDialog.bind(this));
+ $('#dialog-info-point-sure').on('click', this.OnSureClick.bind(this));
+ $('#dialog-info-point-cancel').on('click', this.HideDialog.bind(this));
+ };
+
+ this.OnColClick = function (event) {
+ $('.icon-view .icon-col').removeClass("active");
+
+ var label = $(event.target).is('img') ? $(event.target).parent('div') : $(event.target);
+ label.addClass("active");
+ };
+
+ this.HideDialog = function () {
+ $('#dialog-info-point').hide();
+ $('#map').css('cursor', 'grab');
+ this.Parent.isMark = false;
+ };
+
+ this.ShowDialog = function (point) {
+ this.Point = point;
+ $('#dialog-info-point').show();
+ $("#title").textbox('setValue', '');
+
+ $('.icon-view .icon-col').removeClass("active");
+ $('.icon-view .icon-col').eq(0).addClass("active");
+ };
+
+ this.OnSureClick = function () {
+ this.validation();
+ }
+
+ this.validation = function () {
+ if ($("#title").textbox('getValue').trim() === '') {
+ alert('请输入标题');
+ return
+ } else {
+ $.ajax({
+ type: "POST",
+ dataType: 'text',
+ url: '/Point/Add',
+ data: {
+ Title: $("#title").textbox('getValue'),
+ Icon: $('.icon-view .active').attr('name'),
+ Longitude: this.Point.lng,
+ Latitude: this.Point.lat
+ },
+ success: function (result) {
+ this.Parent.AddInfoPoint(this.Point, $("#title").textbox('getValue'), $('.icon-view .active').attr('name'), result);
+ this.HideDialog();
+ }.bind(this)
+ });
+ }
+ }
+}
\ No newline at end of file
diff --git a/04.系统编码/App/Content/scripts/menggu/map.js b/04.系统编码/App/Content/scripts/menggu/map.js
index f70ab01..10cb35d 100644
--- a/04.系统编码/App/Content/scripts/menggu/map.js
+++ b/04.系统编码/App/Content/scripts/menggu/map.js
@@ -22,11 +22,20 @@ var Map = function (parent) {
this.Parent = parent;
this.WindTemplate = null;
this.MultiLayers = false;
+ this.isMark = false;
+
+ this.InfoPoint = new InfoPoint(this);
this.Startup = function () {
this.CreateMap();
this.InitCapture();
this.LoadWindTemplate();
+ this.LoadInfoPoint();
+ this.InfoPoint.Startup();
+
+ $('#mark-button').on('click', this.onMarkClick.bind(this));
+ $('#draw-button').on('click', this.OnDrawButtonClick.bind(this));
+ $('#clear-button').on('click', this.OnClearButtonClick.bind(this));
$('#particle-switch a').on('click', this.OnParticleButtonClick.bind(this));
$('#label-switch a').on('click', this.OnRemoveMarkersButtonClick.bind(this));
};
@@ -42,8 +51,30 @@ var Map = function (parent) {
L.tileLayer.googleBase().addTo(this.map);
L.tileLayer.googleDetail().addTo(this.map);
$('.leaflet-control-attribution').hide();
+
+ $('.latlng').text('当前经纬度:{0}, {1}'.format(this.getLatLng(111.746303), this.getLatLng(40.854662)));
+ this.map.on('mousemove', this.OnMapMove.bind(this));
+ };
+
+ this.CenterMap = function (lat, lng) {
+ this.map.setView([lat, lng], 11);
+ };
+
+ this.OnMapMove = function (e) {
+ $('.latlng').text('当前经纬度:{0}, {1}'.format(this.getLatLng(e.latlng.lng), this.getLatLng(e.latlng.lat)))
};
+ this.getLatLng = function (value) {
+ value = value.toString()
+ let index = value.indexOf('.')
+ if (index !== -1) {
+ value = value.substring(0, 6 + index + 1)
+ } else {
+ value = value.substring(0)
+ }
+ return parseFloat(value).toFixed(6)
+ }
+
this.OnParticleButtonClick = function () {
// Toggle switch on/off
var parent = $(event.target).parent();
@@ -86,6 +117,67 @@ var Map = function (parent) {
}
};
+ this.OnDrawButtonClick = function () {
+ if (this.map.hasLayer(this.lineLayer))
+ this.map.removeLayer(this.lineLayer);
+
+ this.point = [];
+ this.lineLayer = new L.FeatureGroup();
+ this.map.addLayer(this.lineLayer);
+
+ this.map.on(L.Draw.Event.CREATED, function (e) {
+ this.lineLayer.addLayer(e.layer);
+ this.point.push([e.layer._latlngs[0].lng, e.layer._latlngs[0].lat], [e.layer._latlngs[1].lng, e.layer._latlngs[1].lat]);
+ this.AddPoints(this.lineLayer, this.point, 2, '#000000', '#ff0000');
+ this.SetDistance(e.layer._latlngs[0].lng, e.layer._latlngs[0].lat, e.layer._latlngs[1].lng, e.layer._latlngs[1].lat, this.lineLayer);
+ }.bind(this));
+
+ this.map.on(L.Draw.Event.DRAWVERTEX, function (e) {
+ var layerIds = Object.keys(e.layers._layers);
+ if (layerIds.length > 1) {
+ var secondVertex = e.layers._layers[layerIds[1]]._icon;
+ requestAnimationFrame(() => secondVertex.click());
+ }
+ }.bind(this));
+
+ var drawer = new L.Draw.Polyline(this.map, {});
+ drawer.enable();
+ };
+
+ this.OnClearButtonClick = function () {
+ if (this.map.hasLayer(this.lineLayer))
+ this.map.removeLayer(this.lineLayer);
+ };
+
+ this.SetDistance = function (fromLon, fromLat, toLon, toLat, features) {
+ var lon = (fromLon + toLon) / 2;
+ var lat = (fromLat + toLat) / 2;
+ var from = L.latLng(fromLat, fromLon);
+ var to = L.latLng(toLat, toLon);
+ var bounds = from.distanceTo(to);
+
+ L.marker([lat, lon], {
+ icon: L.divIcon({
+ className: 'distance',
+ html: '两点之间距离为:{0}公里'.format(Math.round((bounds / 1000) * 100) / 100)
+ })
+ }).addTo(features);
+ };
+
+ this.AddPoints = function (features, points, weight, color, fillColor) {
+ $(points).each(function (index, point) {
+ L.circleMarker([point[1], point[0]], {
+ opacity: 1,
+ weight: weight,
+ color: color,
+ fillColor: fillColor,
+ fillOpacity: 1,
+ radius: 4,
+ className: 'point point{0}'.format(point[1].toString().split(".").join(""))
+ }).addTo(features);
+ }.bind(this));
+ };
+
this.GetWindFileName = function () {
var value = $('#release-date').datebox('getValue');
var time = moment(value, 'YYYY/MM/DD HH:mm');
@@ -294,4 +386,65 @@ var Map = function (parent) {
if (value <= 1000)
return 'rgb(192, 28, 36)';
};
+
+ this.LoadInfoPoint = function () {
+ $.ajax({
+ type: "POST",
+ dataType: 'text',
+ url: '/Point/Query',
+ success: function (result) {
+ var data = JSON.parse(result);
+ data.forEach(function (item, index) {
+ var point = {
+ lat: item.Latitude,
+ lng: item.Longitude
+ };
+ this.AddInfoPoint(point, item.Title, item.Icon, item.Id)
+ }.bind(this))
+ }.bind(this)
+ });
+ };
+
+ this.onMarkClick = function () {
+ this.isMark = true;
+
+ $('#map').css('cursor', 'crosshair');
+ this.DrewInfoPoint();
+ };
+
+ this.DrewInfoPoint = function () {
+ this.map.on('click', function (e) {
+ if (this.isMark)
+ this.InfoPoint.ShowDialog(e.latlng);
+ else
+ return;
+ }.bind(this))
+ };
+
+ this.AddInfoPoint = function (point, title, icon, id) {
+ let label = '
'.format(id, title, id, icon.slice(0, 1));
+ L.marker([point.lat, point.lng], {
+ icon: L.divIcon({
+ className: 'info-point-content',
+ html: label
+ })
+ }).addTo(this.map);
+
+ var button = $('#close-btn{0}'.format(id));
+ button.on('click', this.RemoveInfoPoint.bind(this, id));
+ };
+
+ this.RemoveInfoPoint = function (id, event) {
+ $.ajax({
+ type: "POST",
+ dataType: 'text',
+ url: '/Point/Delete',
+ data: {
+ id: id,
+ },
+ success: function () {
+ $('.info-point{0}'.format(id)).hide();
+ }.bind(this)
+ });
+ }
};
\ No newline at end of file
diff --git a/04.系统编码/App/Views/Menggu/Index.cshtml b/04.系统编码/App/Views/Menggu/Index.cshtml
index 567036c..6838103 100644
--- a/04.系统编码/App/Views/Menggu/Index.cshtml
+++ b/04.系统编码/App/Views/Menggu/Index.cshtml
@@ -4,6 +4,7 @@
@section styles {
+
}
@@ -35,6 +40,50 @@
+
+
+
+
添加信息点
+
+
+
+
+
+
+
+
+

+
+
+

+
+
+

+
+
+

+
+
+

+
+
+

+
+
+

+
+
+

+
+
+
+
+
+
+
+
+
+
@@ -84,6 +133,7 @@
@section scripts {
+
@@ -91,6 +141,7 @@
+
}
\ No newline at end of file