toolDraw_new.js 91 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090
  1. /**
  2. * [ONEMAP.M.toolDraw]
  3. * @return {[object]}
  4. */
  5. define([
  6. 'html!templates/tools/toolDraw_new',
  7. 'modDir/service/addressSearch',
  8. 'css!styles/tools/toolDraw_new'
  9. ],
  10. function (tplLayout, addressSearchF) {
  11. var modValue = {
  12. label: false,
  13. // Create an empty GeoJSON collection
  14. collection: {
  15. "type": "FeatureCollection",
  16. "features": []
  17. },
  18. globalGuid: '',
  19. closeSave: false,
  20. showhideAll: true,
  21. drawModel: '',
  22. tipText: '',
  23. drawGroup: [],
  24. sdPicker: 'polyline', //手动选择样式
  25. drawLayerGuids: [], //图形guid存储
  26. textGuids: [], //文字guid存储
  27. styleGuid: '',
  28. textPosition: {}, //文字位置
  29. ajaxData: {}, //保存&导出内容
  30. lastGuid: '',
  31. hdGuid: [],
  32. clostat: true, //弹窗关闭状态
  33. tdPoints: {}, //三维点集合
  34. tdshowData: {
  35. polyArr: [],
  36. lineArr: [],
  37. pointArr: []
  38. },
  39. tdian: {},
  40. tdline: {},
  41. tdpoly: {},
  42. tdcircle: {},
  43. drawType:null
  44. };
  45. ONEMAP.D.transArr = {};
  46. ONEMAP.showhideAll = true;
  47. var status = {
  48. initialized: false //是否初始化
  49. };
  50. var map3 = map2DViewer.map;
  51. function init(type) {
  52. if (!status.initialized) {
  53. setLayout();
  54. bindEvent();
  55. //取消订阅
  56. unSubscribe();
  57. //添加订阅
  58. subscribe();
  59. status.initialized = true;
  60. }
  61. modValue.drawType = type;
  62. ONEMAP.C.publisher.publish({
  63. modName: 'toolDraw'
  64. }, 'toolsd:active');
  65. $(".draw-polyline-latlngs-picker").css("top", "180px");
  66. $(".draw-polyline-latlngs-picker h4").dragmove($(".draw-polyline-latlngs-picker"))
  67. $(".draw-polyline-latlngs-picker h4 span").bind("click", function () {
  68. $(".draw-polyline-latlngs-picker").hide();
  69. $(".tsAct li.sd").removeClass('active')
  70. })
  71. }
  72. function isIE() { //ie?
  73. if (!!window.ActiveXObject || "ActiveXObject" in window) {
  74. return true;
  75. } else {
  76. return false;
  77. }
  78. }
  79. function setLayout() {
  80. $(tplLayout).appendTo($("#wrapper"));
  81. if (!ONEMAP.D.isLoad) {
  82. $("#xingmutishi").addClass('active');
  83. $("#xingmutishi .close").bind("click", function () {
  84. $("#xingmutishi").removeClass('active')
  85. })
  86. // ONEMAP.C.publisher.publish({ type: 'warning', message: '请先登录以便保存' }, 'noteBar::add');
  87. }
  88. if (map23DData.display.map2D) {
  89. $(".tsAct li.import .importFile").show();
  90. } else {
  91. $(".tsAct li.import .importFile").hide();
  92. }
  93. $("#topBar .total-content .tools-tool23Dchange").bind("click", function () {
  94. if (map23DData.display.map2D) {
  95. change23D('2d')
  96. } else {
  97. change23D('3d')
  98. }
  99. })
  100. if (!isIE()) {
  101. // $(".tsTX").dragmove($(".toolBF"));
  102. // $(".toolBF").css("top","330px");
  103. } else {
  104. // $(".toolBF").css("top","370px");
  105. }
  106. }
  107. //删除当前图形、存储、弹窗
  108. ONEMAP.C.delPoly = function (id) {
  109. if (map3._layers[id] == undefined) {
  110. $("#" + id).remove();
  111. } else {
  112. if (map3._layers[id].saveStatu) {
  113. var ajaxData = {
  114. _id: map3._layers[id].saveId
  115. };
  116. $.ajax({
  117. type: "GET",
  118. dataType: 'json',
  119. url: onemapUrlConfig.userCenterUrl + '/draw/del',
  120. data: ajaxData,
  121. success: function (data) {
  122. ONEMAP.V.loading.loaded();
  123. if (data.code == 4) {
  124. ONEMAP.T.noPermission('favorite');
  125. }
  126. if (data.code == 3) {
  127. ONEMAP.T.logout('favorite');
  128. }
  129. if (data.success) {
  130. ONEMAP.C.publisher.publish({
  131. type: 'success',
  132. message: '已删除'
  133. }, 'noteBar::add');
  134. if (ONEMAP.M.hasOwnProperty('userDraw')) {
  135. ONEMAP.M.userDraw.getFavData();
  136. }
  137. } else {
  138. ONEMAP.C.publisher.publish({
  139. type: 'error',
  140. message: '删除失败'
  141. }, 'noteBar::add');
  142. }
  143. },
  144. error: function (errorData) {
  145. ONEMAP.V.loading.loaded();
  146. }
  147. });
  148. }
  149. map3._layers[id].remove();
  150. var index = modValue.drawLayerGuids.indexOf(id);
  151. if (index > -1) {
  152. modValue.drawLayerGuids.splice(index, 1);
  153. }
  154. }
  155. // 文字清除
  156. $(".leaflet-marker-icon." + id).remove();
  157. // 三维点清除
  158. var aaa = $("#" + id + " h4 .bt").attr("tdm");
  159. delPoint(aaa);
  160. delete modValue.tdPoints[aaa];
  161. deltdCircle(modValue.tdcircle[id]);
  162. delete modValue.tdcircle[id];
  163. deltdline(modValue.tdline[id]);
  164. delete modValue.tdline[id];
  165. deltdpoly(modValue.tdpoly[id]);
  166. delete modValue.tdpoly[id];
  167. // 节点清除
  168. $("#" + id).remove();
  169. }
  170. function setStyle(id) {
  171. var setObj = {};
  172. setObj = map3._layers[id];
  173. var guid = modValue.styleGuid;
  174. $("." + guid + " .yanse span").off("click").on("click", function () {
  175. yanse = $(this).attr("class");
  176. switch (yanse) {
  177. case "black":
  178. yanse = "#000";
  179. break;
  180. case "blue":
  181. yanse = "#00f";
  182. break;
  183. case "gray":
  184. yanse = "#828282";
  185. break;
  186. case "green":
  187. yanse = "#007C00";
  188. break;
  189. case "orange":
  190. yanse = "#FF9E02";
  191. break;
  192. case "red":
  193. yanse = "#FE1D23";
  194. break;
  195. case "white":
  196. yanse = "#fff";
  197. break;
  198. case "yellow":
  199. yanse = "#FFFD00";
  200. break;
  201. }
  202. var polyguid = $(this).parents().filter(".pubPop").attr("id");
  203. map3._layers[polyguid].setStyle({
  204. "color": yanse
  205. })
  206. setStyle(polyguid)
  207. if (modValue.drawModel == "polygon" || modValue.drawModel == "rectangle") {
  208. var coods = [];
  209. for (var j = 0; j < setObj._latlngs[0].length; j++) {
  210. coods.push([setObj._latlngs[0][j].lng, setObj._latlngs[0][j].lat]);
  211. }
  212. coods.push([setObj._latlngs[0][0].lng, setObj._latlngs[0][0].lat]);
  213. deltdpoly(modValue.tdpoly[id]);
  214. delete modValue.tdpoly[id];
  215. var sid = add3DPoly(coods, yanse);
  216. modValue.tdpoly[id] = sid;
  217. }
  218. if (modValue.drawModel == "polyline") {
  219. var coods = [];
  220. for (var j = 0; j < setObj._latlngs.length; j++) {
  221. coods.push([setObj._latlngs[j].lng, setObj._latlngs[j].lat]);
  222. }
  223. deltdline(modValue.tdline[id]);
  224. delete modValue.tdline[id];
  225. var sid = add3DLine(coods, yanse);
  226. modValue.tdline[id] = sid;
  227. }
  228. if (modValue.drawModel == "circle") {
  229. var coods = [setObj._latlng.lng, setObj._latlng.lat];
  230. deltdCircle(modValue.tdcircle[id]);
  231. delete modValue.tdcircle[id];
  232. var sid = add3DCircle(coods, setObj._mRadius, yanse);
  233. modValue.tdcircle[id] = sid;
  234. }
  235. // map3.removeLayer(polyguid)
  236. // ONEMAP.M.userDraw.delFav(polyguid)
  237. // saveSingle(polyguid);
  238. })
  239. }
  240. ONEMAP.C.setPop = function (guid) {
  241. ////console.log(guid)
  242. if (typeof (guid) == "string" || typeof (guid) == "number") {
  243. modValue.styleGuid = guid;
  244. } else {
  245. modValue.styleGuid = guid.id;
  246. }
  247. if ($("." + modValue.styleGuid).hasClass("active")) {
  248. $("." + modValue.styleGuid).removeClass("active")
  249. } else {
  250. $("." + modValue.styleGuid).addClass("active")
  251. }
  252. }
  253. function deltdline(guid) {
  254. map3DViewer.polyline({
  255. action: 'remove',
  256. guid: guid
  257. })
  258. }
  259. //删除线
  260. function delPolyline(guid) {
  261. map3DViewer.polyline({
  262. action: 'remove',
  263. guid: guid
  264. })
  265. }
  266. //添加3D线段
  267. function add3DLine(coordinates, color) {
  268. var GDguid = map3DViewer.polyline({
  269. action: 'add',
  270. geojson: {
  271. "properties": {
  272. altitudeMode: 0,
  273. color: color || '#0e74d1',
  274. weight: 2,
  275. opacity: 1
  276. },
  277. "geometry": {
  278. "coordinates": coordinates
  279. }
  280. }
  281. })
  282. return GDguid;
  283. }
  284. //修改3D线段
  285. function updateLine(id, coordinates,color) {
  286. // var cl = '#0e74d1';
  287. // if(color){cl = color}
  288. var GDguid = map3DViewer.polyline({
  289. action: 'update',
  290. geojson: {
  291. "properties": {
  292. altitudeMode: 0,
  293. color: color||'#0e74d1',
  294. weight: 2,
  295. opacity: 1
  296. },
  297. "geometry": {
  298. "coordinates": coordinates
  299. }
  300. },
  301. guid: id
  302. })
  303. return GDguid;
  304. }
  305. //添加点
  306. function addPoint(title, coordinates, tdurl, color) {
  307. var ibg = onemapUrlConfig.siteUrl + '/scripts/vendor/leaflet/draw_new/images/marker-icon.png';
  308. if (tdurl) {
  309. ibg = tdurl
  310. }
  311. var guid = map3DViewer.marker({
  312. action: 'add',
  313. // groupId:modValue.markersGroupGuid,
  314. geojson: {
  315. "type": "Feature",
  316. "properties": {
  317. title: title,
  318. iconUrl: ibg,
  319. icon3DUrl: ibg,
  320. // iconSize: pointStyle.iconSize || '20',
  321. iconSize: [18, 26],
  322. // iconAnchor: pointStyle.iconAnchor || [0,0],
  323. iconAnchor: [0, 0],
  324. popupAnchor: [0, -30],
  325. altitlude: 1,
  326. altitudeMode: 0,
  327. popupContent: 'afsaf',
  328. titleColor: color || '#f00000',
  329. titleFontSize: 20
  330. },
  331. "geometry": {
  332. "type": "Point",
  333. "coordinates": coordinates
  334. }
  335. }
  336. })
  337. return guid;
  338. }
  339. //更新点
  340. function updatePoint(title, guid, pointBg, color) {
  341. var bg = onemapUrlConfig.siteUrl + '/scripts/vendor/leaflet/draw_new/images/marker-icon.png';
  342. if (pointBg) {
  343. bg = pointBg
  344. };
  345. map3DViewer.marker({
  346. action: 'update',
  347. geojson: {
  348. "properties": {
  349. title: title,
  350. iconUrl: bg,
  351. icon3DUrl: bg,
  352. titleColor: color || '#f00',
  353. // titleFontSize: styleInfo.fontSize
  354. }
  355. },
  356. guid: guid
  357. })
  358. }
  359. function updatePointS(title, guid) {
  360. map3DViewer.marker({
  361. action: 'update',
  362. geojson: {
  363. "properties": {
  364. title: title
  365. }
  366. },
  367. guid: guid
  368. })
  369. }
  370. //删除点
  371. function delPoint(guid) {
  372. map3DViewer.marker({
  373. action: 'remove',
  374. guid: guid
  375. })
  376. }
  377. // 获取文字点击位置
  378. function bindGloCli() {
  379. document.onclick = function (ev) {
  380. var oEvent = ev || event;
  381. var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
  382. var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
  383. modValue.textPosition.left = oEvent.clientX + 'px';
  384. modValue.textPosition.top = oEvent.clientY + 'px';
  385. }
  386. }
  387. // 提示文字
  388. function moveTip(model) {
  389. $("#drawTipText").show();
  390. switch (model) {
  391. case "point":
  392. modValue.tipText = '左键点击绘制点标注';
  393. bindGloCli();
  394. break;
  395. case "label":
  396. modValue.tipText = '左键点击绘制文本标注';
  397. bindGloCli();
  398. break;
  399. case "polyline":
  400. modValue.tipText = '左键点击绘制路线';
  401. bindGloCli();
  402. break;
  403. case "polygon":
  404. modValue.tipText = '左键点击绘制面标注';
  405. bindGloCli();
  406. break;
  407. case "rectangle":
  408. modValue.tipText = '左键点击绘制矩形';
  409. bindGloCli();
  410. break;
  411. case "circle":
  412. modValue.tipText = '左键点击绘制圆';
  413. bindGloCli();
  414. break;
  415. }
  416. $("#drawTipText").text(modValue.tipText)
  417. document.onmousemove = function (ev) {
  418. var oEvent = ev || event;
  419. var oDiv = document.getElementById('drawTipText');
  420. var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
  421. var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
  422. oDiv.style.left = oEvent.clientX + scrollLeft + 'px';
  423. oDiv.style.top = oEvent.clientY + scrollTop + 'px';
  424. }
  425. }
  426. function bindEvent() {
  427. map3.pm.addControls({
  428. drawMarker: true,
  429. drawPolygon: false,
  430. editPolygon: false,
  431. drawPolyline: true,
  432. deleteLayer: false,
  433. editMode: true,
  434. toggleEdit: true
  435. });
  436. map3.on('pm:drawstart', function (e) {
  437. var layer = e.workingLayer;
  438. layer.on('pm:vertexadded', function (e) {
  439. switch (modValue.drawModel) {
  440. case "polyline":
  441. modValue.tipText = '左键双击结束绘制';
  442. break;
  443. case "polygon":
  444. modValue.tipText = '左键点击绘制面标注;点击第一个点完成绘画';
  445. break;
  446. case "rectangle":
  447. modValue.tipText = '左键点击完成绘制';
  448. break;
  449. case "circle":
  450. modValue.tipText = '左键点击完成绘制';
  451. break;
  452. }
  453. $("#drawTipText").text(modValue.tipText)
  454. });
  455. layer.on('pm:snapdrag', function (e) {
  456. // ////console.log(e)
  457. switch (modValue.drawModel) {
  458. case "polyline":
  459. modValue.tipText = '左键双击结束绘制';
  460. break;
  461. case "polygon":
  462. modValue.tipText = '左键点击绘制面标注;点击第一个点完成绘画';
  463. break;
  464. case "rectangle":
  465. modValue.tipText = '左键点击完成绘制';
  466. break;
  467. case "circle":
  468. modValue.tipText = '左键点击完成绘制';
  469. break;
  470. }
  471. $("#drawTipText").text(modValue.tipText)
  472. });
  473. });
  474. // 图形创建后编辑及绑定弹窗
  475. map3.on('pm:create', function (e) {
  476. modValue.lastGuid = "";
  477. bindEdit(e);
  478. $('#toolsBar .tools-painting').removeClass('cur');
  479. });
  480. //移除当前图形选择
  481. function rmDom(shape) {
  482. switch (shape) {
  483. case 4:
  484. $('.tsTX .polygon').removeClass('active');
  485. break;
  486. case 3:
  487. $('.tsTX .polyline').removeClass('active');
  488. break;
  489. case 5:
  490. $('.tsTX .rectangle').removeClass('active');
  491. break;
  492. case 6:
  493. $('.tsTX .circle').removeClass('active');
  494. break;
  495. case 1:
  496. $('.tsTX .point').removeClass('active');
  497. break;
  498. }
  499. }
  500. $(".pubPop button.del").bind("click", function () {
  501. // delPoint(guid);
  502. // delete modValue.tdPoints[shortGu];
  503. //console.log("shanchu")
  504. })
  505. // 图形绘制
  506. $(".tsTX li").on("click", function () {
  507. if (map23DData.display.map2D) {
  508. $(".tsTX li").not(this).removeClass('active')
  509. if ($(this).hasClass('active')) {
  510. $(this).removeClass('active')
  511. } else {
  512. $(this).addClass('active')
  513. $(".tsAct li").removeClass("active");
  514. $(".draw-polyline-latlngs-picker").hide();
  515. }
  516. if ($(this).hasClass("label")) {
  517. modValue.label = true;
  518. } else {
  519. modValue.label = false;
  520. }
  521. moveTip($(this).attr("layer"));
  522. modValue.drawModel = $(this).attr("layer");
  523. } else if ($(this).hasClass("point")) {
  524. $(".tsTX li").not(this).removeClass('active')
  525. if ($(this).hasClass('active')) {
  526. $(this).removeClass('active')
  527. } else {
  528. $(this).addClass('active')
  529. $(".tsAct li").removeClass("active");
  530. $(".draw-polyline-latlngs-picker").hide();
  531. }
  532. } else {
  533. alert("三维暂只支持点标注")
  534. }
  535. })
  536. /**
  537. * 下载文件
  538. */
  539. var downloadTextFile = function (mobileCode) {
  540. var v = IEVersion();
  541. if (v == 'ie' || v == 'Edge') {
  542. var fileObj = new Blob([mobileCode], {
  543. type: 'json/application'
  544. });
  545. // ////console.log(fileObj);
  546. window.navigator.msSaveBlob(fileObj, '标注' + getdate() + '.json');
  547. } else if (v == '-1') {
  548. var file = new File([mobileCode], '标注' + getdate() + '.json', {
  549. type: "text/plain;charset=utf-8"
  550. });
  551. saveAs(file);
  552. }
  553. setTimeout(function () {
  554. $(".tsAct li.export").removeClass('active')
  555. }, 200)
  556. }
  557. //判断是否是IE浏览器,包括Edge浏览器
  558. function IEVersion() {
  559. var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
  560. var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE浏览器
  561. var isEdge = userAgent.indexOf("Windows NT 6.1; Trident/7.0;") > -1 && !isIE; //判断是否IE的Edge浏览器
  562. if (isIE) {
  563. return "ie";
  564. } else if (isEdge) {
  565. return "Edge";
  566. } else {
  567. return "-1"; //非IE
  568. }
  569. }
  570. var adName = '';
  571. $("#userDrawAddName").on("change", function () {
  572. adName = $("#userDrawAddName").val();
  573. })
  574. $("#userDrawAddModal .form .sure").bind("click", function () {
  575. saveDraw(adName + ";" + getdate(), 'all', 'add', false, getdate());
  576. $("#userDrawAddModal").hide();
  577. })
  578. $("#userDrawAddModal .close").bind("click", function () {
  579. $("#userDrawAddModal").hide();
  580. })
  581. }
  582. //获取点位位置信息
  583. function getPointName(earthLatlng, callback) {
  584. var addressSearch = new addressSearchF();
  585. var region = addressSearch.getAddressInfo({
  586. // zoom: map2DViewer.map.getZoom(),
  587. zoom: map23DData.view.zoom,
  588. latLng: [earthLatlng.lat, earthLatlng.lng]
  589. }, function (data) {
  590. var data = data.data;
  591. callback(data.region);
  592. });
  593. }
  594. function popact(guid, type) {
  595. $(".pubPop").children().not(".pubPop_2").not(".ppfooter").bind("click", function () {
  596. $(".pubPop_2." + guid).removeClass("active");
  597. })
  598. $(".pubPop").children().not(".intro").bind("click", function () {
  599. $(".popTips").remove();
  600. })
  601. $("#" + guid + " .point").unbind("click").bind("click", function () {
  602. if ($(".pubPop_2." + guid).hasClass("active")) {
  603. $(".pubPop_2." + guid).removeClass("active")
  604. } else {
  605. $(".pubPop_2." + guid).addClass("active");
  606. }
  607. })
  608. $("#" + guid + " h4").dragmove($("#" + guid));
  609. setTimeout(function () {
  610. $("#" + guid + " .close").one("click", function () {
  611. if (modValue.clostat) {
  612. $("#" + guid).removeClass("active");
  613. $(".pubPop_2." + guid).removeClass("active");
  614. $(".popTips").remove();
  615. saveSingle(guid);
  616. }
  617. if (modValue.lastGuid) {
  618. $("#" + guid).attr('id', modValue.lastGuid);
  619. }
  620. })
  621. }, 200)
  622. $("#" + guid + " .lineStyle").unbind("click").bind("click", function () {
  623. setStyle(guid)
  624. })
  625. }
  626. function layerActs(e) {
  627. var id = e.target._leaflet_id;
  628. if (e.target.shape == "Marker") {
  629. var lat = e.latlng.lat;
  630. var lng = e.latlng.lng;
  631. $("#" + id + " .ppfooter input").eq(0).val(lat);
  632. $("#" + id + " .ppfooter input").eq(1).val(lng);
  633. pTle = "点标注";
  634. $("#" + id + " h4 .bt").text(pTle);
  635. getPointName(e.latlng, function (addr) {
  636. pTle = addr;
  637. $("#" + id + " h4 .bt").text(addr);
  638. });
  639. }
  640. if ($("#" + id).hasClass("active")) {
  641. $("#" + id).removeClass("active")
  642. modValue.clostat = true;
  643. } else {
  644. $("#" + id).addClass("active")
  645. modValue.clostat = false;
  646. setTimeout(function () {
  647. modValue.clostat = true;
  648. }, 400)
  649. $("#" + id + " .close").unbind("click").bind("click", function () {
  650. if (modValue.clostat) {
  651. $("#" + id).removeClass("active");
  652. $(".pubPop_2." + id).removeClass("active");
  653. $(".popTips").remove();
  654. saveSingle(id);
  655. }
  656. if (modValue.lastGuid) {
  657. $("#" + id).attr('id', modValue.lastGuid);
  658. }
  659. })
  660. }
  661. }
  662. // 设置文字样式
  663. function setTxt(lat, lng, guid, type, txtContent, tcolor) {
  664. var myIcon = L.divIcon({
  665. html: txtContent,
  666. className: guid,
  667. iconSize: 30
  668. });
  669. modValue.hdGuid.push(guid);
  670. modValue.labelCss = {};
  671. modValue.labelCss = L.marker([lat, lng], {
  672. icon: myIcon
  673. }).addTo(map3);
  674. modValue.labelCss.shape = 'Marker';
  675. var txtStyle = {
  676. width: 145,
  677. font: 28,
  678. color: '#00f'
  679. }
  680. if (type == 'point') {
  681. txtStyle.width = 200;
  682. txtStyle.font = 20;
  683. txtStyle.color = '#f00';
  684. txtStyle.shadow = '0';
  685. $(".leaflet-marker-icon." + guid).css({
  686. 'margin-left': 15 + 'px',
  687. 'margin-top': -70 + 'px',
  688. 'text-shadow': 0
  689. })
  690. modValue.textGuids.push(guid)
  691. } else if (type == 'label') {
  692. $(".leaflet-marker-icon." + guid).css({
  693. "text-shadow": 1 + "px " + 0 + "px " + 0 + "px #fff"
  694. })
  695. $("#" + guid + " .close").unbind("click").bind("click", function () {
  696. $("#" + guid).removeClass("active");
  697. $(".pubPop_2." + guid).removeClass("active");
  698. saveSingle(modValue.labelCss._leaflet_id, guid);
  699. })
  700. $(".leaflet-marker-icon." + guid).unbind("click").bind("click", function () {
  701. if ($("#" + guid).hasClass("active")) {
  702. $("#" + guid).removeClass("active")
  703. } else {
  704. $("#" + guid).addClass("active")
  705. $("#" + guid + " .close").unbind("click")
  706. setTimeout(function () {
  707. $("#" + guid + " .close").unbind("click").bind("click", function () {
  708. $("#" + guid).removeClass("active");
  709. $(".pubPop_2." + guid).removeClass("active");
  710. saveSingle(modValue.labelCss._leaflet_id, guid);
  711. })
  712. }, 300)
  713. }
  714. })
  715. }
  716. modValue.labelCss.options = {
  717. Oclass: guid,
  718. Ofz: txtStyle.font,
  719. Oc: txtStyle.color,
  720. Off: '黑体',
  721. txt: txtContent
  722. }
  723. map3._layers[modValue.labelCss._leaflet_id].saveStatu = true;
  724. $(".leaflet-marker-icon." + guid).css({ //设置文字样式
  725. "width": txtStyle.width + "px",
  726. "height": "auto",
  727. "font-size": txtStyle.font + "px",
  728. "color": txtStyle.color,
  729. "font-family": "黑体",
  730. "word-break": "break-all"
  731. })
  732. }
  733. // 切换时更新三维数据
  734. function up3DrawData() {
  735. var data = map2DViewer.map._layers;
  736. $.each(data, function (key, dl) {
  737. if (dl.shape == 'Line') {
  738. var coods = [];
  739. for (var j = 0; j < dl._latlngs.length; j++) {
  740. coods.push([dl._latlngs[j].lng, dl._latlngs[j].lat]);
  741. }
  742. updateLine(modValue.tdline[dl._leaflet_id], coods,dl.options.color);
  743. }
  744. });
  745. // return JSON.stringify(data);
  746. }
  747. function bindEdit(e) {
  748. modValue.closeSave = true;
  749. $(".tsTX li").not(".point").not(".label").removeClass('active')
  750. // //console.log(e);
  751. $(".leaflet-popup-tip-container").hide();
  752. var layer = e.layer || e;
  753. var shape = e.shape;
  754. var tdpoint = ''; //三维点guid
  755. modValue.drawLayerGuids.push(layer._leaflet_id);
  756. var guid = layer._leaflet_id;
  757. modValue.globalGuid = guid;
  758. // //console.log(layer._leaflet_id);
  759. layer.on('pm:dragend', function (item) {
  760. console.log(item);
  761. layer._latlngs = item.target._latlngs;
  762. });
  763. map3._layers[guid].shape = shape;
  764. map3._layers[guid].saveStatu = false;
  765. var lat, lng;
  766. var pTle, type;
  767. if (modValue.label == false) {
  768. switch (shape) {
  769. case "Poly":
  770. pTle = "面标注";
  771. type = 4;
  772. $("#drawTipText").hide();
  773. // 同时添加三维面
  774. var coods = [];
  775. for (var j = 0; j < layer._latlngs[0].length; j++) {
  776. coods.push([layer._latlngs[0][j].lng, layer._latlngs[0][j].lat]);
  777. }
  778. var tdguid = add3DPoly(coods);
  779. modValue.tdpoly[guid] = tdguid;
  780. break;
  781. case "Line":
  782. pTle = "绘制路线";
  783. type = 3;
  784. $("#drawTipText").hide();
  785. // 同时添加三维线段
  786. var coods = [];
  787. for (var j = 0; j < layer._latlngs.length; j++) {
  788. coods.push([layer._latlngs[j].lng, layer._latlngs[j].lat]);
  789. }
  790. var tdguid = add3DLine(coods);
  791. modValue.tdline[guid] = tdguid;
  792. break;
  793. case "Rectangle":
  794. pTle = "矩形";
  795. type = 5;
  796. $("#drawTipText").hide();
  797. // 同时添加三维面
  798. var coods = [];
  799. for (var j = 0; j < layer._latlngs[0].length; j++) {
  800. coods.push([layer._latlngs[0][j].lng, layer._latlngs[0][j].lat]);
  801. }
  802. var tdguid = add3DPoly(coods);
  803. modValue.tdpoly[guid] = tdguid;
  804. break;
  805. case "Circle":
  806. pTle = "圆";
  807. type = 6;
  808. $("#drawTipText").hide();
  809. // 同时添加三维圆
  810. var coods = [layer._latlng.lng, layer._latlng.lat];
  811. var tdguid = add3DCircle(coods, layer._mRadius);
  812. modValue.tdcircle[guid] = tdguid;
  813. break;
  814. case "Marker":
  815. lat = e.marker._latlng.lat || e._latlng.lat;
  816. lng = e.marker._latlng.lng || e._latlng.lng;
  817. pTle = "点标注";
  818. getPointName(e.marker._latlng, function (addr) {
  819. pTle = addr;
  820. $("#" + guid + " h4 .bt").text(addr);
  821. // setTxt(lat,lng,guid,'point',pTle);
  822. setTxt(lat, lng, guid, 'point', '');
  823. // 添加三维标注点
  824. var rs = [lng, lat];
  825. tdpoint = addPoint(addr, rs);
  826. modValue.tdian[guid] = tdpoint;
  827. $("#" + guid + " h4 .bt").attr("tdm", tdpoint);
  828. // $(".leaflet-marker-icon."+guid).text(pTle);
  829. });
  830. type = 1;
  831. break;
  832. }
  833. layer.addEventListener('click', function (e) {
  834. layerActs(e);
  835. layer.pm.toggleEdit();
  836. });
  837. //定制dom
  838. var popStyle = '';
  839. if (modValue.drawModel == "point") {
  840. var popTop = '<div class="pubPop" id="' + guid + '">' +
  841. '<h4 class=""><span class="bt">' + pTle + '</span><span class="close">×</span></h4>' +
  842. '<div class="title">标注名称</div>' +
  843. '<div><input type="text" class="zhuji"></div>' +
  844. '<div class="intro"><span>附加说明</span>' +
  845. '<div class="tips">' +
  846. '<img src="images/tools/new/link.png" alt="链接文本" class="tplink">' +
  847. '<img src="images/tools/new/img.png" alt="链接图片" class="tpimg">' +
  848. '<img src="images/tools/new/video.png" alt="链接视频" class="tpvideo">' +
  849. '</div></div>' +
  850. '<textarea class="draw-latlngs-textarea"></textarea>';
  851. var imgUrl = onemapUrlConfig.siteUrl + "/images/tools/new/grayPoint.png";
  852. popFooter = '<div class="ppfooter bg">' +
  853. '<img src=' + imgUrl + ' class="yuanbg">' +
  854. '<input type="text" value="' + layer._latlng.lat + '" class="weizhi">' +
  855. '<input type="text" value="' + layer._latlng.lng + '" class="weizhi">' +
  856. '<button class="del" onclick="ONEMAP.C.delPoly(' + guid + ');"></button>' +
  857. '<button class="point"></button>' +
  858. '</div>';
  859. popStyle = '<div class="pubPop_2 style pointSty ' + guid + '">' +
  860. '<div>图标</div><div class="marker-build-list icon-list">' +
  861. '<span><img tid="1" src="' + map23DConfig.map23DAssetsUrl + '/images/layout/marker/r1.png"></span>' +
  862. '<span><img tid="2" src="' + map23DConfig.map23DAssetsUrl + '/images/layout/marker/r2.png"></span>' +
  863. '<span><img tid="5" src="' + map23DConfig.map23DAssetsUrl + '/images/layout/marker/b1.png"></span>' +
  864. '<span><img tid="6" src="' + map23DConfig.map23DAssetsUrl + '/images/layout/marker/b2.png"></span>' +
  865. '<span><img tid="9" src="' + map23DConfig.map23DAssetsUrl + '/images/layout/marker/y1.png"></span>' +
  866. '<span><img tid="10" src="' + map23DConfig.map23DAssetsUrl + '/images/layout/marker/y2.png"></span>' +
  867. '</div></div>';
  868. } else {
  869. //默认dom
  870. var popTop = '<div class="pubPop" id="' + guid + '">' +
  871. '<h4 class=""><span class="bt">' + pTle + '</span><span class="close">×</span></h4>' +
  872. '<div class="title">路线名称</div>' +
  873. '<div><input type="text" class="zhuji"></div>' +
  874. '<div class="intro"><span>附加说明</span>' +
  875. '<div class="tips">' +
  876. '<img src="images/tools/new/link.png" alt="链接文本" class="tplink">' +
  877. '<img src="images/tools/new/img.png" alt="链接图片" class="tpimg">' +
  878. '<img src="images/tools/new/video.png" alt="链接视频" class="tpvideo">' +
  879. '</div></div>' +
  880. '<textarea class="draw-latlngs-textarea"></textarea>';
  881. popFooter = '<div class="ppfooter">' +
  882. '<button class="del" onclick="ONEMAP.C.delPoly(' + guid + ')"></button>' +
  883. '<button class="lineStyle" onclick="ONEMAP.C.setPop(' + String(guid) + ');"></button>' +
  884. '</div>';
  885. popStyle = '<div class="pubPop_2 style ' + guid + '">' +
  886. '<div class="lineColor">线条颜色</div><div class="yanse xt">' +
  887. '<span class="blue"></span><span class="green"></span>' +
  888. '<span class="red"></span><span class="orange"></span>' +
  889. '<span class="yellow"></span><span class="gray"></span>' +
  890. '<span class="white"></span><span class="black"></span>' +
  891. '</div></div>';
  892. }
  893. var pop = popTop + popFooter + popStyle + '</div>';
  894. //绑定弹窗
  895. $("body").append($(pop));
  896. if (modValue.drawModel == "point") {
  897. setTimeout(function () {
  898. $("#" + guid).css({
  899. "left": modValue.textPosition.left,
  900. "top": modValue.textPosition.top
  901. })
  902. $(".tsTX li.point").click();
  903. $("#" + guid).addClass("active");
  904. popact(guid, 'point')
  905. }, 200)
  906. // } else if(modValue.drawModel == "circle"){
  907. } else {
  908. setTimeout(function () {
  909. $("#" + guid).css({
  910. "left": modValue.textPosition.left,
  911. "top": modValue.textPosition.top
  912. })
  913. $("#" + guid).addClass("active");
  914. popact(guid)
  915. }, 200)
  916. }
  917. // var b = layer.bindPopup(pop).openPopup();
  918. //样式设置
  919. map3._layers[guid].lastLayer = {};
  920. map3._layers[guid].styleStatu = 0;
  921. //附加说明链接控制
  922. var poplink = '<div class="pubPop_link popTips" layer="' + guid + '">' +
  923. '<div class="bt">链接快捷编辑</div>' +
  924. '<div class="wenzi">链接文字</div>' +
  925. '<div><input type="text" placeholder="请输入文字..." class="wz"></div>' +
  926. '<div class="wenzi">链接地址</div>' +
  927. '<div><input type="text" placeholder="url链接" class="link"><span class="shengcheng">生成</span></div>' +
  928. '</div>';
  929. var popimg = '<div class="pubPop_img popTips" layer="' + guid + '">' +
  930. '<div class="bt">图像快捷编辑</div><div class="wenzi">图像链接</div>' +
  931. '<div><input type="text" placeholder="url链接" class="link"><span class="shengcheng">生成</span></div>' +
  932. '</div>';
  933. var popvideo = '<div class="pubPop_video popTips" layer="' + guid + '">' +
  934. '<div class="bt">视频快捷编辑</div><div class="wenzi">视频链接</div>' +
  935. '<div><input type="text" placeholder="url链接" class="link"><span class="shengcheng">生成</span></div>' +
  936. '</div>';
  937. var apStatu = 0;
  938. $("#" + guid + " .intro .tips img.tplink").bind("click", function () {
  939. if (apStatu != 1) {
  940. apStatu = 1;
  941. $("#" + guid + " .popTips").remove();
  942. $("#" + guid).append($(poplink));
  943. var pTxt, pLink;
  944. $("#" + guid + " .pubPop_link div input.link").on("change", function () {
  945. pLink = $("#" + guid + " .pubPop_link div input.link").val();
  946. })
  947. $("#" + guid + " .pubPop_link div input.wz").on("change", function () {
  948. pTxt = $("#" + guid + " .pubPop_link div input.wz").val();
  949. })
  950. $("#" + guid + " .pubPop_link div .shengcheng").bind("click", function () {
  951. if (pTxt == undefined) {
  952. pTxt = '链接'
  953. }
  954. var a = '<a href="' + pLink + '">' + pTxt + '</a>';
  955. var v = $("#" + guid + " textarea").val();
  956. $("#" + guid + " textarea").val(v + a);
  957. map3._layers[guid].tip = v + a;
  958. $("#" + guid + " .pubPop_link").remove();
  959. apStatu = 0;
  960. })
  961. } else if (apStatu == 1) {
  962. $("#" + guid + " .pubPop_link").remove();
  963. apStatu = 0;
  964. }
  965. })
  966. $("#" + guid + " .intro .tips img.tpimg").unbind("click").bind("click", function () {
  967. if (apStatu != 2) {
  968. apStatu = 2;
  969. $(".popTips").remove();
  970. $("#" + guid).append($(popimg));
  971. var pTxt, pLink;
  972. $(".pubPop_img div input.link").on("change", function () {
  973. pLink = $(".pubPop_img div input.link").val();
  974. })
  975. $(".pubPop_img div .shengcheng").bind("click", function () {
  976. var a = '<img src="' + pLink + '" alt="图片链接">';
  977. var v = $("#" + guid + " textarea").val();
  978. $("#" + guid + " textarea").val(v + a);
  979. map3._layers[guid].tip = v + a;
  980. $(".pubPop_img").remove();
  981. apStatu = 0;
  982. })
  983. } else if (apStatu == 2) {
  984. $(".pubPop_img").remove();
  985. apStatu = 0;
  986. }
  987. })
  988. $("#" + guid + " .intro .tips img.tpvideo").unbind("click").bind("click", function () {
  989. if (apStatu != 3) {
  990. apStatu = 3;
  991. $(".popTips").remove();
  992. $("#" + guid).append($(popvideo));
  993. var pTxt, pLink;
  994. $(".pubPop_video div input.link").on("change", function () {
  995. pLink = $(".pubPop_video div input.link").val();
  996. })
  997. $(".pubPop_video div .shengcheng").bind("click", function () {
  998. var a = '<video controls="" autoplay="" name="media"><source src="' + pLink + '" type="video/mp4"></video>';
  999. var v = $("#" + guid + " textarea").val();
  1000. $("#" + guid + " textarea").val(v + a);
  1001. map3._layers[guid].tip = v + a;
  1002. $(".pubPop_video").remove();
  1003. apStatu = 0;
  1004. })
  1005. } else if (apStatu == 3) {
  1006. $(".pubPop_video").remove();
  1007. apStatu = 0;
  1008. }
  1009. })
  1010. $("#" + guid + " .zhuji").bind("input propertychange", function (event) {
  1011. var viewName = this.value;
  1012. $(".leaflet-marker-icon." + guid).text(viewName)
  1013. map3._layers[guid].zhuji = viewName;
  1014. });
  1015. $("#" + guid + " textarea").bind("input propertychange", function (event) {
  1016. map3._layers[guid].tip = this.value;
  1017. });
  1018. //位置修改
  1019. $("#" + guid + " .ppfooter .yuanbg").bind('click', function (event) {
  1020. //   if (event.keyCode == "13") {
  1021. //回车执行跳转
  1022. console.log("ttasdf")
  1023. var wz1 = JSON.parse($("#" + guid + " .ppfooter .weizhi").eq(0).val());
  1024. var wz2 = JSON.parse($("#" + guid + " .ppfooter .weizhi").eq(1).val());
  1025. map2DViewer.map._layers[guid].setLatLng({
  1026. lat: wz1,
  1027. lng: wz2
  1028. });
  1029. var nm = $(".leaflet-marker-icon." + guid).text();
  1030. $(".leaflet-marker-icon." + guid).remove();
  1031. getPointName({
  1032. lat: wz1,
  1033. lng: wz2
  1034. }, function (addr) {
  1035. $("#" + guid + " h4 .bt").text(addr);
  1036. })
  1037. setTxt(wz1, wz2, guid, 'point', nm);
  1038. map23DControl.setView({
  1039. center: {
  1040. lat: wz1,
  1041. lng: wz2
  1042. },
  1043. zoom: map2DViewer.map.getZoom()
  1044. })
  1045. //   }
  1046. });
  1047. $("#" + guid + " .ppfooter .weizhi").bind('keydown', function (event) {
  1048. if (event.keyCode == "13") {
  1049. return false;
  1050. }
  1051. })
  1052. if (modValue.drawModel == "point") {
  1053. // 使用用户自己的图标
  1054. var eqIcon;
  1055. // var eqIcon = map23DConfig.map23DAssetsUrl+'/images/layout/marker/roadsign_type_1_m.png';
  1056. var LeafIcon = L.Icon.extend({
  1057. options: {
  1058. iconSize: [25, 41],
  1059. iconAnchor: [12, 41]
  1060. }
  1061. });
  1062. $(".pubPop_2." + guid + " .icon-list span img").unbind("click").bind("click", function () {
  1063. var tid = $(this).attr("tid");
  1064. switch (tid) {
  1065. case "1":
  1066. eqIcon = map23DConfig.map23DAssetsUrl + '/images/layout/marker/r1.png';
  1067. break;
  1068. case "2":
  1069. eqIcon = map23DConfig.map23DAssetsUrl + '/images/layout/marker/r2.png';
  1070. break;
  1071. case "5":
  1072. eqIcon = map23DConfig.map23DAssetsUrl + '/images/layout/marker/b1.png';
  1073. break;
  1074. case "6":
  1075. eqIcon = map23DConfig.map23DAssetsUrl + '/images/layout/marker/b2.png';
  1076. break;
  1077. case "9":
  1078. eqIcon = map23DConfig.map23DAssetsUrl + '/images/layout/marker/y1.png';
  1079. break;
  1080. case "10":
  1081. eqIcon = map23DConfig.map23DAssetsUrl + '/images/layout/marker/y2.png';
  1082. break;
  1083. }
  1084. // ////console.log(eqIcon);
  1085. $(".pubPop_2." + guid + " .icon-list span").removeClass("select");
  1086. $(this).parent().addClass("select")
  1087. var greenIcon = new LeafIcon({
  1088. iconUrl: eqIcon
  1089. });
  1090. layer.setIcon(greenIcon)
  1091. })
  1092. }
  1093. } else if (modValue.drawModel == "label") {
  1094. var lat = e.marker._latlng.lat || e._latlng.lat;
  1095. var lng = e.marker._latlng.lng || e._latlng.lng;
  1096. var labelTitle = '文本注记';
  1097. getPointName(e.marker._latlng, function (addr) {
  1098. labelTitle = addr;
  1099. $("#" + guid + " h4 .bt").text(addr);
  1100. });
  1101. modValue.textGuids.push(guid);
  1102. var popLabel = '<div class="pubPop" id="' + guid + '"><h4 class=""><span class="bt">' + labelTitle + '</span><span class="close">×</span></h4>' +
  1103. '<div class="title">注记文本</div>' +
  1104. '<div><input type="text" class="zhuji" value="新文本"></div>' +
  1105. '<div class="ppfooter">' +
  1106. '<button class="del"></button>' +
  1107. '<button class="txt"></button>' +
  1108. '</div><div class="pubPop_2 ' + guid + '">' +
  1109. '<div class="fontWeight">文字大小</div>' +
  1110. '<div><select class="daxiao">' +
  1111. '<option>大</option><option>中</option><option>小</option>' +
  1112. '</select></div>' +
  1113. '<div class="fontStyle">文字样式</div>' +
  1114. '<div><select class="yangshi">' +
  1115. '<option>黑体</option><option>微软雅黑</option><option>宋体</option>' +
  1116. '</select></div>' +
  1117. '<div class="fontColor">文字颜色</div>' +
  1118. '<div class="yanse zt">' +
  1119. '<span layer="ys1"></span><span layer="ys2"></span>' +
  1120. '<span layer="ys3"></span><span layer="ys4"></span>' +
  1121. '<span layer="ys5"></span><span layer="ys6"></span>' +
  1122. '<span layer="ys7"></span><span layer="ys8"></span>' +
  1123. '</div></div></div>';
  1124. var myIcon = L.divIcon({
  1125. html: "新文本",
  1126. className: guid,
  1127. iconSize: 30
  1128. });
  1129. modValue.hdGuid.push(guid);
  1130. modValue.labelCss = {};
  1131. modValue.labelCss = L.marker([lat, lng], {
  1132. icon: myIcon
  1133. }).addTo(map3);
  1134. modValue.labelCss.shape = 'Label';
  1135. modValue.labelCss.options = {
  1136. Oclass: guid,
  1137. Ofz: 28,
  1138. Oc: '#00f',
  1139. Off: '黑体',
  1140. txt: '新文本'
  1141. }
  1142. map3._layers[modValue.labelCss._leaflet_id].saveStatu = false;
  1143. $(".leaflet-marker-icon." + guid).css({ //设置文字样式
  1144. "width": 145 + "px",
  1145. "height": "auto",
  1146. "font-size": 28 + "px",
  1147. "color": "#00f",
  1148. "text-shadow": 1 + "px " + 0 + "px " + 0 + "px #fff",
  1149. "font-family": "黑体",
  1150. "word-break": "break-all"
  1151. })
  1152. //绑定弹窗
  1153. $("body").append($(popLabel));
  1154. setTimeout(function () {
  1155. $("#" + guid).addClass("active");
  1156. $("#" + guid).css({
  1157. "left": modValue.textPosition.left,
  1158. "top": modValue.textPosition.top
  1159. })
  1160. $(".tsTX li.label").click();
  1161. }, 200)
  1162. var rs = [lng, lat];
  1163. var tdlabel = "新文本";
  1164. var color = "#00f";
  1165. var ibg = '../../scripts/vendor/leaflet/draw_new/images/marker-icon.png';
  1166. // setTxt(lat,lng,guid,'label','新文本');//添加二维文本
  1167. map3._layers[guid].shape = 'Label';
  1168. var tdguid = addPoint(tdlabel, rs, ibg, '#00f'); // 添加三维文本
  1169. modValue.tdian[guid] = tdguid;
  1170. $(".pubPop").children().not(".pubPop_2").not(".ppfooter").unbind("click").bind("click", function () {
  1171. $(".pubPop_2." + guid).removeClass("active");
  1172. })
  1173. $(".pubPop").children().not(".intro").bind("click", function () {
  1174. $(".popTips").remove();
  1175. })
  1176. $("#" + guid + " h4").dragmove($("#" + guid));
  1177. // var b = layer.bindPopup(popLabel).openPopup();
  1178. $("#" + guid + " button.del").bind("click", function () {
  1179. // ////console.log("del")
  1180. $("#" + guid).remove();
  1181. $(".leaflet-marker-icon." + guid).remove();
  1182. map3._layers[guid].remove();
  1183. })
  1184. $("#" + guid + " .close").one("click", function () {
  1185. $("#" + guid).removeClass("active");
  1186. $(".pubPop_2." + guid).removeClass("active");
  1187. saveSingle(modValue.labelCss._leaflet_id, guid);
  1188. })
  1189. $(".leaflet-marker-icon." + guid).unbind("click").bind("click", function () {
  1190. $("#" + guid).addClass('active');
  1191. setTimeout(function () {
  1192. $("#" + guid + " .close").one("click", function () {
  1193. $("#" + guid).removeClass("active");
  1194. $(".pubPop_2." + guid).removeClass("active");
  1195. saveSingle(modValue.labelCss._leaflet_id, guid);
  1196. })
  1197. }, 250)
  1198. })
  1199. $("#" + guid + " .zhuji").bind("input propertychange", function (event) {
  1200. tdlabel = this.value;
  1201. $(".leaflet-marker-icon." + guid).text(tdlabel);
  1202. map3._layers[guid].zhuji = tdlabel;
  1203. modValue.labelCss.options.txt = tdlabel;
  1204. });
  1205. $("#" + guid + " button.txt").bind("click", function () {
  1206. if ($(".pubPop_2." + guid).hasClass("active")) {
  1207. $(".pubPop_2." + guid).removeClass("active")
  1208. } else {
  1209. $(".pubPop_2." + guid).addClass("active")
  1210. }
  1211. })
  1212. //文本样式设置
  1213. var daxiao = 28,
  1214. ziti = 'Microsoft yahei',
  1215. yanse = '#000';
  1216. $("#" + guid + " .daxiao").on("change", function () {
  1217. if ($(this).val() == '大') {
  1218. daxiao = 28;
  1219. } else if ($(this).val() == '中') {
  1220. daxiao = 20;
  1221. } else if ($(this).val() == '小') {
  1222. daxiao = 12;
  1223. }
  1224. $(".leaflet-marker-icon." + guid).css("font-size", daxiao + "px");
  1225. // map3._layers[guid].options.Ofz = daxiao;
  1226. modValue.labelCss.options.Ofz = daxiao;
  1227. })
  1228. $("#" + guid + " .yangshi").on("change", function () {
  1229. ziti = $(this).val();
  1230. if ($(this).val() == '微软雅黑') {
  1231. ziti = 'Microsoft yahei';
  1232. }
  1233. $(".leaflet-marker-icon." + guid).css("font-family", ziti);
  1234. // map3._layers[guid].options.Off = ziti;
  1235. modValue.labelCss.options.Off = ziti;
  1236. })
  1237. $("#" + guid + " .yanse span").on("click", function () {
  1238. yanse = $(this).attr("layer");
  1239. var sd = "fff";
  1240. switch (yanse) {
  1241. case "ys8":
  1242. yanse = "#000";
  1243. break;
  1244. case "ys1":
  1245. yanse = "#00f";
  1246. break;
  1247. case "ys6":
  1248. yanse = "#828282";
  1249. break;
  1250. case "ys2":
  1251. yanse = "#007C00";
  1252. break;
  1253. case "ys4":
  1254. yanse = "#FF9E02";
  1255. sd = "000";
  1256. break;
  1257. case "ys3":
  1258. yanse = "#FE1D23";
  1259. break;
  1260. case "ys7":
  1261. yanse = "#fff";
  1262. sd = "000";
  1263. break;
  1264. case "ys5":
  1265. yanse = "#FFFD00";
  1266. sd = "000";
  1267. break;
  1268. }
  1269. $(".leaflet-marker-icon." + guid).css({
  1270. "color": yanse,
  1271. "text-shadow": 1 + "px " + 0 + "px " + 0 + "px #" + sd
  1272. });
  1273. // map3._layers[guid].options.Oc = yanse;
  1274. modValue.labelCss.options.Oc = yanse;
  1275. $("#" + guid + " .yanse span").not(this).removeClass("active");
  1276. $(this).addClass("active");
  1277. })
  1278. }
  1279. }
  1280. // 删除旧的页面标注
  1281. function cleanOld() {
  1282. // 清除旧的三维数据
  1283. var oldtd = modValue.tdshowData;
  1284. $.each(oldtd.polyArr, function (key, dl) {
  1285. delPolygon(dl);
  1286. var index = oldtd.polyArr.indexOf(dl);
  1287. if (index > -1) {
  1288. oldtd.polyArr.splice(index, 1);
  1289. }
  1290. })
  1291. $.each(oldtd.lineArr, function (key, dl) {
  1292. delPolyline(dl);
  1293. var index = oldtd.lineArr.indexOf(dl);
  1294. if (index > -1) {
  1295. oldtd.lineArr.splice(index, 1);
  1296. }
  1297. })
  1298. $.each(oldtd.pointArr, function (key, dl) {
  1299. delPoint(dl);
  1300. var index = oldtd.pointArr.indexOf(dl);
  1301. if (index > -1) {
  1302. oldtd.pointArr.splice(index, 1);
  1303. }
  1304. })
  1305. }
  1306. // 展示当前页
  1307. function showDraw(data) {
  1308. var tuxingData = JSON.parse(data.draw_data);
  1309. var layer;
  1310. var Did = data._id;
  1311. $(".leaflet-marker-icon." + Did).remove();
  1312. $("#" + Did).remove();
  1313. if (data.name.indexOf(";") > -1) {
  1314. var darr = data.name.split(";");
  1315. data.name = darr[0];
  1316. data.tip = darr[2];
  1317. }
  1318. ////console.log(tuxing);
  1319. var tuxing = [];
  1320. var LeafIcon = L.Icon.extend({
  1321. options: {
  1322. iconSize: [25, 41],
  1323. iconAnchor: [12, 41]
  1324. }
  1325. });
  1326. if (tuxingData.shape) {
  1327. tuxing.push(tuxingData);
  1328. } else {
  1329. tuxing = tuxingData;
  1330. }
  1331. // $("#userContent .userInfo .moreLink .linkList li.myBh").show();
  1332. for (var i = 0; i < tuxing.length; i++) {
  1333. if (tuxing[i].shape == 'Poly') {
  1334. if (!tuxing[i].zhuji) {
  1335. tuxing[i].zhuji = data.name;
  1336. }
  1337. layer = L.polygon(tuxing[i].LatLngs, tuxing[i].options).addTo(map3);
  1338. layer.shape = 'Poly';
  1339. // 同时添加三维面
  1340. var coods = [];
  1341. for (var j = 0; j < tuxing[i].LatLngs[0].length; j++) {
  1342. coods.push([tuxing[i].LatLngs[0][j].lng, tuxing[i].LatLngs[0][j].lat]);
  1343. }
  1344. coods.push([tuxing[i].LatLngs[0][0].lng, tuxing[i].LatLngs[0][0].lat]);
  1345. var polyid;
  1346. if (tuxing[i].options.color) {
  1347. polyid = add3DPoly(coods, tuxing[i].options.color);
  1348. } else {
  1349. polyid = add3DPoly(coods);
  1350. }
  1351. modValue.tdpoly[layer._leaflet_id] = polyid;
  1352. // modValue.tdshowData.polyArr.push(polyid);
  1353. }
  1354. if (tuxing[i].shape == 'Line') {
  1355. if (!tuxing[i].zhuji) {
  1356. tuxing[i].zhuji = data.name;
  1357. }
  1358. layer = L.polyline(tuxing[i].LatLngs, tuxing[i].options).addTo(map3);
  1359. layer.shape = 'Line';
  1360. // 同时添加三维线段
  1361. var coods = [];
  1362. for (var j = 0; j < tuxing[i].LatLngs.length; j++) {
  1363. coods.push([tuxing[i].LatLngs[j].lng, tuxing[i].LatLngs[j].lat]);
  1364. }
  1365. var lineid;
  1366. if (tuxing[i].options.color) {
  1367. lineid = add3DLine(coods, tuxing[i].options.color);
  1368. } else {
  1369. lineid = add3DLine(coods);
  1370. }
  1371. modValue.tdline[layer._leaflet_id] = lineid;
  1372. // modValue.tdshowData.lineArr.push(lineid);
  1373. }
  1374. if (tuxing[i].shape == 'Rectangle') {
  1375. if (!tuxing[i].zhuji) {
  1376. tuxing[i].zhuji = data.name;
  1377. }
  1378. layer = L.polygon(tuxing[i].LatLngs, tuxing[i].options).addTo(map3);
  1379. layer.shape = 'Rectangle';
  1380. // 同时添加三维面
  1381. var coods = [];
  1382. for (var j = 0; j < tuxing[i].LatLngs[0].length; j++) {
  1383. coods.push([tuxing[i].LatLngs[0][j].lng, tuxing[i].LatLngs[0][j].lat]);
  1384. }
  1385. coods.push([tuxing[i].LatLngs[0][0].lng, tuxing[i].LatLngs[0][0].lat]);
  1386. var polyid;
  1387. if (tuxing[i].options.color) {
  1388. polyid = add3DPoly(coods, tuxing[i].options.color);
  1389. } else {
  1390. polyid = add3DPoly(coods);
  1391. }
  1392. modValue.tdpoly[layer._leaflet_id] = polyid;
  1393. // modValue.tdshowData.polyArr.push(polyid);
  1394. }
  1395. if (tuxing[i].shape == 'Marker') {
  1396. if (!tuxing[i].zhuji) {
  1397. tuxing[i].zhuji = data.name;
  1398. }
  1399. if (tuxing[i].options.icon) {
  1400. var xinOp = {};
  1401. xinOp.draggable = tuxing[i].options.draggable;
  1402. xinOp.opacity = tuxing[i].options.opacity;
  1403. layer = L.marker(tuxing[i].LatLngs, xinOp).addTo(map3);
  1404. var eqIcon = tuxing[i].options.icon.options.iconUrl;
  1405. var greenIcon = new LeafIcon({
  1406. iconUrl: eqIcon
  1407. });
  1408. layer.setIcon(greenIcon)
  1409. } else {
  1410. layer = L.marker(tuxing[i].LatLngs, tuxing[i].options).addTo(map3);
  1411. }
  1412. layer.shape = 'Marker';
  1413. // 同时添加文本注记
  1414. var myIcon = L.divIcon({
  1415. html: tuxing[i].zhuji || data.name,
  1416. className: Did,
  1417. iconSize: 30
  1418. });
  1419. var atxt = L.marker([tuxing[i].LatLngs.lat, tuxing[i].LatLngs.lng], {
  1420. icon: myIcon
  1421. }).addTo(map3);
  1422. $(".leaflet-marker-icon." + Did).css({ //设置文字样式
  1423. "width": 200 + "px",
  1424. "height": "auto",
  1425. "font-size": 20 + "px",
  1426. "color": '#f00',
  1427. "word-break": "break-all",
  1428. 'margin-left': 15 + 'px',
  1429. 'margin-top': -70 + 'px',
  1430. })
  1431. $(".leaflet-marker-icon." + Did).prev().addClass(Did.toString()); //Marker添加class
  1432. modValue.textGuids.push(Did);
  1433. // 同时添加三维数据
  1434. var rs = [tuxing[i].LatLngs.lng, tuxing[i].LatLngs.lat]
  1435. var guid = '';
  1436. if (tuxing[i].options.icon) {
  1437. var eqIcon = tuxing[i].options.icon.options.iconUrl;
  1438. guid = addPoint(tuxing[i].zhuji || data.name, rs, eqIcon);
  1439. modValue.tdian[layer._leaflet_id] = guid;
  1440. } else {
  1441. guid = addPoint(tuxing[i].zhuji || data.name, rs)
  1442. modValue.tdian[layer._leaflet_id] = guid;
  1443. }
  1444. //展示后的三维数据存储到tdPoints中
  1445. var os = {};
  1446. os.lng = tuxing[i].LatLngs.lng;
  1447. os.lat = tuxing[i].LatLngs.lat;
  1448. var tdm = {
  1449. guid: guid,
  1450. shape: 'Marker',
  1451. LatLngs: os,
  1452. options: '',
  1453. zhuji: tuxing[i].zhuji || data.name,
  1454. tip: data.tip || '',
  1455. erid: Did
  1456. };
  1457. ONEMAP.D.transArr[Did] = guid;
  1458. modValue.tdPoints[guid] = tdm;
  1459. // 展示中存储
  1460. // modValue.tdshowData.pointArr.push(guid);
  1461. }
  1462. if (tuxing[i].shape == 'Label') {
  1463. var myIcon = L.divIcon({
  1464. html: data.name || tuxing[i].options.txt,
  1465. className: tuxing[i].options.Oclass,
  1466. iconSize: 30
  1467. });
  1468. // layer = L.marker(tuxing[i].LatLngs, { icon: myIcon }).addTo(map3);
  1469. if (tuxing[i].options.Oclass) {
  1470. layer = L.marker(tuxing[i].LatLngs, {
  1471. icon: myIcon
  1472. }).addTo(map3);
  1473. } else {
  1474. layer = {};
  1475. }
  1476. $(".leaflet-marker-icon." + tuxing[i].options.Oclass).css({ //设置文字样式
  1477. "width": 145 + "px",
  1478. "height": "auto",
  1479. "font-size": tuxing[i].options.Ofz + "px",
  1480. "color": tuxing[i].options.Oc,
  1481. "text-shadow": 1 + "px " + 0 + "px " + 0 + "px #fff",
  1482. "font-family": tuxing[i].options.Off,
  1483. "word-break": "break-all",
  1484. "opacity": 1
  1485. })
  1486. $(".leaflet-marker-icon." + tuxing[i].options.Oclass).addClass(Did.toString());
  1487. layer.shape = 'Label';
  1488. tuxing[i].zhuji = data.name || tuxing[i].options.txt;
  1489. // 同时添加三维数据
  1490. var rs = [tuxing[i].LatLngs.lng, tuxing[i].LatLngs.lat]
  1491. var guid = '';
  1492. var ibg = '../../scripts/vendor/leaflet/draw_new/images/marker-icon.png';
  1493. // if(tuxing[i].options.icon){
  1494. // var eqIcon = tuxing[i].options.icon.options.iconUrl;
  1495. // guid = addPoint(tuxing[i].zhuji||data.name,rs,eqIcon);
  1496. // modValue.tdian[atxt._leaflet_id] = guid;
  1497. // } else{
  1498. guid = addPoint(tuxing[i].zhuji || data.name, rs, ibg, tuxing[i].options.Oc || '#00f')
  1499. modValue.tdian[layer._leaflet_id] = guid;
  1500. // }
  1501. }
  1502. if (tuxing[i].shape == 'Circle') {
  1503. if (!tuxing[i].zhuji) {
  1504. tuxing[i].zhuji = data.name;
  1505. }
  1506. var cl = '#3388ff'
  1507. if (tuxing[i].options.color) {
  1508. cl = tuxing[i].options.color
  1509. }
  1510. layer = new L.Circle(tuxing[i].LatLngs, tuxing[i].options.radius, {
  1511. color: cl, //颜色
  1512. fillColor: tuxing[i].options.fillColor || cl,
  1513. fillOpacity: tuxing[i].options.fillOpacity || 0.5, //透明度
  1514. }).addTo(map3);
  1515. layer.shape = 'Circle';
  1516. // 添加三维圆
  1517. var rs = [tuxing[i].LatLngs.lng, tuxing[i].LatLngs.lat]
  1518. var guid = add3DCircle(rs, tuxing[i].options.radius, cl);
  1519. modValue.tdcircle[layer._leaflet_id] = guid;
  1520. }
  1521. // Did = 'd_'+(Did+i);
  1522. // Did = Did+i;
  1523. ////console.log(layer);
  1524. if (layer != undefined) {
  1525. modValue.drawLayerGuids.push(layer._leaflet_id);
  1526. }
  1527. var label = '';
  1528. if ((tuxing[i].zhuji || tuxing[i].tip) && tuxing[i].options.opacity != 0.0001) {
  1529. if (tuxing[i].tip == undefined || tuxing[i].tip == 'undefined' || typeof (tuxing[i].tip) == undefined) {
  1530. tuxing[i].tip = '';
  1531. }
  1532. if (tuxing[i].zhuji == undefined || tuxing[i].zhuji == 'undefined' || typeof (tuxing[i].zhuji) == undefined) {
  1533. tuxing[i].zhuji = '';
  1534. }
  1535. if (data.tip) {
  1536. tuxing[i].tip = data.tip;
  1537. }
  1538. label = '<div class="pubPop pubPopRe ' + layer._leaflet_id + '" id="' + Did + '">' +
  1539. '<h4 class=""><span class="bt">' + data.name + '</span><span class="close">×</span><span class="del"></span></h4>' +
  1540. '<div class="title">注记文本<button class="cgEdit">修改</button></div>' +
  1541. '<div><input type="text" class="zhuji" value="' + tuxing[i].zhuji + '" readonly="readonly"></div>' +
  1542. '<div class="intro"><span>附加说明</span></div>' +
  1543. '<textarea class="draw-latlngs-textarea">' + tuxing[i].tip + '</textarea>' +
  1544. '<div class="yingXiang">' + tuxing[i].tip + '</div></div>';
  1545. $(label).appendTo($("#wrapper"))
  1546. var lingid;
  1547. layer.addEventListener('click', function (e) {
  1548. //console.log(e);
  1549. lingid = e.target._leaflet_id;
  1550. $("." + lingid).css({
  1551. "left": e.containerPoint.x + 30 + "px",
  1552. "top": e.containerPoint.y + 30 + "px"
  1553. });
  1554. if ($("." + lingid).hasClass("xianshi")) {
  1555. $("." + lingid).removeClass("xianshi");
  1556. } else {
  1557. $("." + lingid).addClass("xianshi")
  1558. modValue.cln = false;
  1559. $("#" + Did + " .close").unbind("click").bind("click", function () {
  1560. if (modValue.cln) {
  1561. // if(map3._layers[layer._leaflet_id]){map3._layers[layer._leaflet_id].remove();}
  1562. $("#" + Did).removeClass("xianshi");
  1563. }
  1564. })
  1565. setTimeout(function () {
  1566. modValue.cln = true;
  1567. }, 250)
  1568. }
  1569. })
  1570. //列表弹窗拖拽
  1571. $("#" + Did + " h4").dragmove($("#" + Did));
  1572. // $("#"+Did).show();
  1573. map3._layers[layer._leaflet_id].zhuji = $("#" + Did + " .zhuji").val();
  1574. map3._layers[layer._leaflet_id].tip = $("#" + Did + " .draw-latlngs-textarea").val()
  1575. $("#" + Did + " .zhuji").bind("input propertychange", function (event) {
  1576. map3._layers[layer._leaflet_id].zhuji = this.value;
  1577. data.name = this.value;
  1578. });
  1579. //删除
  1580. $("#" + Did + ".pubPop h4 .del").bind("click", function () {
  1581. $("#" + Did).remove();
  1582. // 三维删除
  1583. delPoint(modValue.tdian[layer._leaflet_id]);
  1584. delete modValue.tdian[layer._leaflet_id];
  1585. deltdCircle(modValue.tdcircle[layer._leaflet_id]);
  1586. delete modValue.tdcircle[layer._leaflet_id];
  1587. deltdline(modValue.tdline[layer._leaflet_id]);
  1588. delete modValue.tdline[layer._leaflet_id];
  1589. deltdpoly(modValue.tdpoly[layer._leaflet_id]);
  1590. delete modValue.tdpoly[layer._leaflet_id];
  1591. // 二维删除
  1592. map3.removeLayer(map3._layers[layer._leaflet_id]);
  1593. $(".leaflet-marker-icon." + Did).remove();
  1594. // 收藏删除
  1595. ONEMAP.M.userDraw.delFav(Did);
  1596. // $("#usdFavor #userFavList dt."+Did).find(".del").click();
  1597. })
  1598. // $("#"+Did+" .tName").bind("input propertychange",function(event){
  1599. // data.name = this.value;
  1600. // });
  1601. $("#" + Did + " .draw-latlngs-textarea").bind("input propertychange", function (event) {
  1602. map3._layers[layer._leaflet_id].tip = this.value;
  1603. data.tip = this.value;
  1604. });
  1605. $("#" + Did + " .cgEdit").bind("click", function () {
  1606. if ($(this).hasClass('cur')) {
  1607. //无update,change方法
  1608. // saveDraw(data.name,'all','update',Did);
  1609. updateDraw(Did, data.name + ";" + getdate() + ";" + data.tip);
  1610. $("#" + Did + " .bt").text(data.name);
  1611. $(".leaflet-marker-icon." + Did).text(data.name);
  1612. //信息已修改
  1613. // map3._layers[layer._leaflet_id].remove();
  1614. // $("#"+Did).remove();
  1615. $("#" + Did).removeClass("xianshi");
  1616. } else {
  1617. $("#" + Did + " .zhuji").removeAttr("readonly");
  1618. $("#" + Did + " .draw-latlngs-textarea").show();
  1619. // $("#"+Did+" .tName").show();
  1620. $("#" + Did + " .yingXiang").hide();
  1621. $(this).text("完成");
  1622. $(this).addClass('cur')
  1623. }
  1624. });
  1625. // setTimeout(function(){
  1626. // $("#"+Did+" .close").unbind("click").bind("click",function(){
  1627. // // if(map3._layers[layer._leaflet_id]){map3._layers[layer._leaflet_id].remove();}
  1628. // $("#"+Did).removeClass("xianshi");
  1629. // })
  1630. // },250)
  1631. }
  1632. }
  1633. // if(map23DData.display.map2D){
  1634. // modValue.controlAll();
  1635. // }
  1636. // 用户中心删除
  1637. $("#userFavList .sure").bind("click", function () {
  1638. console.log("223423")
  1639. // map3._layers[layer._leaflet_id].remove();
  1640. // $("#"+Did).remove();
  1641. // $("."+tuxing[i].options.Oclass).remove();
  1642. })
  1643. }
  1644. //更新数据
  1645. function updateDraw(guid, name) {
  1646. var options = {};
  1647. options._id = guid;
  1648. options.name = name;
  1649. $.ajax({
  1650. type: "get",
  1651. dataType: 'json',
  1652. url: onemapUrlConfig.userCenterUrl + '/draw/update',
  1653. data: options,
  1654. success: function (data) {
  1655. console.log(data);
  1656. ONEMAP.M.userDraw.getFavData();
  1657. }
  1658. })
  1659. }
  1660. //保存数据
  1661. function saveDraw(name, quantity, action, guid, infoName) {
  1662. //构造数据
  1663. modValue.ajaxData.name = name;
  1664. modValue.ajaxData.center_lon = map2DViewer.map.getCenter()['lng'];
  1665. modValue.ajaxData.center_lat = map2DViewer.map.getCenter()['lat'];
  1666. modValue.ajaxData.initial_zoom = map2DViewer.map.getZoom();
  1667. modValue.ajaxData.map_type = 1;
  1668. if (quantity == 'all') {
  1669. modValue.ajaxData.draw_data = jsonDrawData();
  1670. } else {
  1671. modValue.ajaxData.draw_data = createSingleData(quantity);
  1672. }
  1673. // if(action == 'update'){
  1674. // modValue.ajaxData._id = guid;
  1675. // }
  1676. modValue.ajaxData.info = 'newdraw;' + infoName || 'newdraw'; //其他信息
  1677. // if(info){
  1678. // modValue.ajaxData.info = info;
  1679. // }
  1680. ////console.log(modValue.ajaxData)
  1681. ONEMAP.V.loading.load();
  1682. $.ajax({
  1683. type: "post",
  1684. dataType: 'json',
  1685. url: onemapUrlConfig.userCenterUrl + '/draw/' + action,
  1686. data: modValue.ajaxData,
  1687. success: function (data) {
  1688. //console.log(data)
  1689. ONEMAP.V.loading.loaded();
  1690. if (data.code == 4) {
  1691. ONEMAP.T.noPermission('favorite');
  1692. }
  1693. if (data.code == 3) {
  1694. ONEMAP.T.logout('favorite');
  1695. }
  1696. if (data.success) {
  1697. ONEMAP.C.publisher.publish({
  1698. type: 'success',
  1699. message: '保存成功,可在“用户中心-我的收藏-绘制路线”中打开'
  1700. }, 'noteBar::add');
  1701. if (ONEMAP.M.hasOwnProperty('userDraw')) {
  1702. //ONEMAP.M.userDraw.isFavDataChange = true;
  1703. ONEMAP.M.userDraw.getFavData();
  1704. }
  1705. if (guid) {
  1706. map3._layers[guid].saveId = data.id;
  1707. }
  1708. } else if (data.msg == '标绘名已存在') {
  1709. ONEMAP.C.publisher.publish({
  1710. type: 'warning',
  1711. message: '名称重复,请填写注记文本'
  1712. }, 'noteBar::add');
  1713. }
  1714. },
  1715. error: function (errorData) {
  1716. ONEMAP.V.loading.loaded();
  1717. }
  1718. });
  1719. }
  1720. //创建单个绘制数据
  1721. function createSingleData(dl) {
  1722. var dlItem = {
  1723. shape: dl.shape,
  1724. options: dl.options,
  1725. zhuji: dl.zhuji,
  1726. tip: dl.tip
  1727. }
  1728. if (dl._latlngs && dl.options.fillOpacity != 1) {
  1729. dlItem.LatLngs = dl._latlngs;
  1730. }
  1731. if (dl._latlng) {
  1732. dlItem.LatLngs = dl._latlng;
  1733. }
  1734. //console.log(JSON.stringify(dlItem));
  1735. return JSON.stringify(dlItem);
  1736. }
  1737. function getdate() {
  1738. var now = new Date(),
  1739. y = now.getFullYear(),
  1740. m = now.getMonth() + 1,
  1741. d = now.getDate();
  1742. return y + "-" + (m < 10 ? "0" + m : m) + "-" + (d < 10 ? "0" + d : d) + " " + now.toTimeString().substr(0, 8);
  1743. }
  1744. //保存单个绘制
  1745. function saveSingle(id, delId) {
  1746. // if(modValue.drawModel=='label'||modValue.drawModel=='point'){
  1747. var info = $("#" + id + " h4 .bt").text() + " " + getdate();
  1748. var name = '未命名标注';
  1749. var sName = name + ";" + getdate();
  1750. var zj = $("#" + id + " .zhuji").val();
  1751. if (zj != "") {
  1752. sName = zj + ";" + getdate();
  1753. }
  1754. var sst;
  1755. if (map3._layers[id] != undefined) {
  1756. sst = map3._layers[id].saveStatu;
  1757. if (map3._layers[id].shape == "Label") {
  1758. info = $("#" + delId + " h4 .bt").text() + " " + getdate();
  1759. }
  1760. } else {
  1761. sst = false
  1762. }
  1763. if (id != undefined && id != 'undefined' && typeof (id) != undefined && (!isNaN(id)) && sst == false && map3._layers[id] != undefined) {
  1764. // if(id!=undefined&&id!='undefined'&&typeof(id)!=undefined&&(!isNaN(id))&&map3._layers[id]!=undefined){
  1765. // if(modValue.drawModel=='label'||modValue.drawModel=='point'||id==modValue.globalGuid&&modValue.closeSave){
  1766. var zt = '';
  1767. if (modValue.drawModel == 'label') {
  1768. var zt = map3._layers[id].options.txt;
  1769. sName = zt + ";" + getdate();
  1770. } else {
  1771. if (map3._layers[id]._latlngs) {
  1772. // map3._layers[id].setStyle({"color":"#00f"})
  1773. }
  1774. if (map3._layers[id]._latlng) {
  1775. // map3._layers[id].setOpacity(1);
  1776. }
  1777. }
  1778. //console.log("保存标注");
  1779. //console.log(map3._layers[id]);
  1780. // saveDraw(sName,map3._layers[id],'add',id,showName);
  1781. if (zt != undefined && map3._layers[id].options.opacity != 0.0001) {
  1782. saveDraw(sName, map3._layers[id], 'add', id, info);
  1783. // saveDraw(sName,'all','add');
  1784. map3._layers[id].saveStatu = true;
  1785. modValue.closeSave = false;
  1786. }
  1787. }
  1788. // }
  1789. }
  1790. //获取上一个标注id
  1791. function getLastId(e) {
  1792. // if(!modValue.labelCss){
  1793. $(".pubPop .close").click();
  1794. var pop = $(".pubPop");
  1795. var length = pop.length;
  1796. var id = parseInt(pop.eq(length - 1).attr("id"));
  1797. if (id > 0) {
  1798. saveSingle(id);
  1799. }
  1800. // } else{
  1801. // $(".pubPop .close").click();
  1802. // }
  1803. }
  1804. /**
  1805. * 解析DrawGroup图层信息并返回JSON串
  1806. * @returns {*}
  1807. * @private
  1808. */
  1809. function jsonDrawData() {
  1810. var data = [];
  1811. // if(map23DData.display.map2D){
  1812. $.each(map3._layers, function (key, dl) {
  1813. if (dl._latlngs) {
  1814. if (dl.options.fillOpacity != 1) {
  1815. var dlItem = {
  1816. shape: dl.shape,
  1817. LatLngs: dl._latlngs,
  1818. options: dl.options,
  1819. zhuji: dl.zhuji,
  1820. tip: dl.tip
  1821. }
  1822. data.push(dlItem);
  1823. }
  1824. }
  1825. if (dl._latlng) {
  1826. if (map3._layers[dl._leaflet_id].saveStatu == false) {
  1827. var dlItem = {
  1828. shape: dl.shape,
  1829. LatLngs: dl._latlng,
  1830. options: dl.options,
  1831. zhuji: dl.zhuji,
  1832. tip: dl.tip
  1833. }
  1834. data.push(dlItem);
  1835. }
  1836. }
  1837. });
  1838. // }
  1839. // else{
  1840. // // alert(3333)
  1841. // $.each(modValue.tdPoints,function(key,dl){
  1842. // var dlItem = {
  1843. // shape: dl.shape,
  1844. // LatLngs: dl.LatLngs,
  1845. // options: dl.options,
  1846. // zhuji: dl.zhuji,
  1847. // tip: dl.tip
  1848. // }
  1849. // data.push(dlItem);
  1850. // })
  1851. // }
  1852. return JSON.stringify(data);
  1853. }
  1854. function change23D(options) {
  1855. if (options == '2d') {
  1856. $(".tsAct li.import .importFile").show();
  1857. } else {
  1858. $(".tsAct li.import .importFile").hide();
  1859. up3DrawData()
  1860. }
  1861. }
  1862. /**
  1863. * 模块移除
  1864. * @return {[type]} [description]
  1865. */
  1866. function remove(options) {
  1867. $(".pubPop,.tdPop").remove();
  1868. ONEMAP.showhideAll = true; //全部显隐
  1869. if (!$("#userContent .userInfo .moreLink .linkList li.myBh").hasClass("uFavo")) {
  1870. $("#userContent .userInfo .moreLink .linkList li.myBh").addClass("uFavo");
  1871. }
  1872. // modValue.tdPoints = {};
  1873. // $("#userContent .userInfo .moreLink .linkList li.myBh").hide();
  1874. if (options.modName != "toolDraw") {
  1875. $('#toolsBar .tools-painting').removeClass('cur');
  1876. ONEMAP.C.publisher.publish({
  1877. modName: 'mapfish::hide'
  1878. }, 'mapfish');
  1879. map3.pm.disableDraw('Line');
  1880. } else {
  1881. if ($('#toolsBar .tools-painting').hasClass('cur')) {
  1882. $('#toolsBar .tools-painting').removeClass('cur');
  1883. ONEMAP.C.publisher.publish({
  1884. modName: 'mapfish::hide'
  1885. }, 'mapfish');
  1886. map3.pm.disableDraw('Line');
  1887. } else {
  1888. // $('#toolsBar .tools-painting').addClass('cur');
  1889. // $(".toolBF").show();
  1890. }
  1891. }
  1892. if (options.modName == "bh") {
  1893. $('#toolsBar .tools-painting').addClass('cur');
  1894. }
  1895. map3.pm.disableDraw('Marker');
  1896. map3.pm.disableDraw('Line');
  1897. map3.pm.disableDraw('Poly');
  1898. map3.pm.disableDraw('Rectangle');
  1899. map3.pm.disableDraw('Circle');
  1900. $(".tsTX li").removeClass("active");
  1901. $("#drawTipText").text("").hide();
  1902. var guids = modValue.drawLayerGuids;
  1903. for (var i = 0; i < guids.length; i++) {
  1904. if (map3._layers[guids[i]]) {
  1905. var type = map3._layers[guids[i]].shape
  1906. map3.removeLayer(map3._layers[guids[i]]);
  1907. switch (type) {
  1908. case "Poly":
  1909. case "Rectangle":
  1910. deltdpoly(modValue.tdpoly[guids[i]])
  1911. break;
  1912. case "Line":
  1913. deltdline(modValue.tdline[guids[i]])
  1914. break;
  1915. case "Label":
  1916. delPoint(modValue.tdian[guids[i]])
  1917. break;
  1918. case "Circle":
  1919. deltdCircle(modValue.tdcircle[guids[i]])
  1920. break;
  1921. default:
  1922. break;
  1923. }
  1924. }
  1925. }
  1926. modValue.drawLayerGuids = [];
  1927. var tG = modValue.textGuids;
  1928. for (var i = 0; i < tG.length; i++) {
  1929. $("." + tG[i]).remove();
  1930. // map3.removeLayer(map3._layers[tG[i]]);
  1931. }
  1932. modValue.textGuids = [];
  1933. $.each(modValue.tdPoints, function (key, dl) {
  1934. delPoint(key);
  1935. delete modValue.tdPoints[key];
  1936. })
  1937. }
  1938. function otherTool(e) {
  1939. if (e.modName != "toolDraw") {
  1940. if (e.modName == 'cleanMap') {
  1941. remove({
  1942. modName: 'toolDraw'
  1943. });
  1944. }
  1945. }else {
  1946. if(modValue.drawType == 'Line'){
  1947. if($('#toolsBar .tools-marker').hasClass('cur')){
  1948. map3.pm.disableDraw('Marker');
  1949. $('#toolsBar .tools-marker').removeClass('cur');
  1950. }
  1951. if($('#toolsBar .tools-painting').hasClass('cur')){
  1952. map3.pm.disableDraw('Line');
  1953. $("#drawTipText").hide();
  1954. $('#toolsBar .tools-painting').removeClass('cur');
  1955. }else{
  1956. moveTip('polyline');
  1957. map3.pm.enableDraw('Line');
  1958. modValue.drawModel = 'polyline';
  1959. $('#toolsBar .tools-painting').addClass('cur');
  1960. }
  1961. }
  1962. if(modValue.drawType == 'Marker'){
  1963. if($('#toolsBar .tools-painting').hasClass('cur')){
  1964. map3.pm.disableDraw('Line');
  1965. $('#toolsBar .tools-painting').removeClass('cur');
  1966. }
  1967. if($('#toolsBar .tools-marker').hasClass('cur')){
  1968. map3.pm.disableDraw('Marker');
  1969. $("#drawTipText").hide();
  1970. $('#toolsBar .tools-marker').removeClass('cur');
  1971. }else{
  1972. moveTip('point');
  1973. map3.pm.enableDraw('Marker');
  1974. modValue.drawModel = 'point';
  1975. $('#toolsBar .tools-marker').addClass('cur');
  1976. }
  1977. }
  1978. }
  1979. }
  1980. /**
  1981. * 注册订阅
  1982. * @type {Function}
  1983. * 推送:ONEMAP.C.publisher.publish(options,'moduleName::type');
  1984. * 订阅:ONEMAP.C.publisher.subscribe(layoutResize,'sideBarLayoutChange');
  1985. */
  1986. function subscribe() {
  1987. ONEMAP.C.publisher.subscribe(change23D, 'change23D');
  1988. ONEMAP.C.publisher.subscribe(remove,'cleanMap');
  1989. ONEMAP.C.publisher.subscribe(otherTool, 'toolsd:active');
  1990. ONEMAP.C.publisher.subscribe(otherTool, 'tools:active');
  1991. ONEMAP.C.publisher.subscribe(getLastId, 'mapClick2D');
  1992. }
  1993. /**
  1994. * 取消订阅
  1995. * @type {Function}
  1996. * 取消订阅:ONEMAP.C.publisher.unSubscribe(layoutResize,'sideBarLayoutChange');
  1997. */
  1998. function unSubscribe() {
  1999. ONEMAP.C.publisher.unSubscribe(remove, 'cleanMap');
  2000. ONEMAP.C.publisher.unSubscribe(otherTool, 'toolsd:active');
  2001. ONEMAP.C.publisher.unSubscribe(otherTool, 'tools:active');
  2002. }
  2003. return ONEMAP.M.toolDraw = {
  2004. init: init,
  2005. showDraw: showDraw,
  2006. remove: remove
  2007. }
  2008. });