relation.js 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722
  1. function Relation(legcerNo,regNo,data){
  2. this.legcerNo = legcerNo;
  3. this.regNo = regNo;
  4. this.data = data;
  5. this.zoomlevel = 1;
  6. this.w = 0;
  7. this.h = 0;
  8. this.index = -1;
  9. this.redrawflag = false;
  10. this.infovisdiv = null;
  11. this.svg = null;
  12. this.force = null;
  13. this.lines = null;
  14. this.nodes = null;
  15. this.mouseoverstatus = false;
  16. this.chargeVal = -1600;
  17. }
  18. Relation.prototype.init = function(){
  19. var thisClass = this;
  20. $(function(){
  21. $("#entrelation-fullscreen").bind("click",function(){
  22. thisClass.initFullScreen();
  23. });
  24. thisClass.w = $("#entrelation").width();
  25. thisClass.h = $("#entrelation").height();
  26. $("#entrelation-infovis").width(thisClass.w).append(
  27. '<div class="entrelation-controlls hidden-sm hidden-xs">'
  28. +'<div class="entrelation-item">'
  29. +'<div id="entrelation-fullscreen" class="entrelation-box" title_pos="left"><div class="entrelation-fullscreen"></div></div>'
  30. +'</div>'
  31. +'</div>'
  32. );
  33. if($(".entrelation-controlls").length>0){
  34. $(".entrelation-controlls").css({left:$("#entrelation").width()-$(".entrelation-controlls").width()});
  35. }
  36. });
  37. //处理全屏
  38. $(document).on('webkitfullscreenchange mozfullscreenchange msfullscreenchange fullscreenchange', function(){
  39. if (!document.fullscreenElement && !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement){
  40. //退出
  41. thisClass.cancelFullScreen();
  42. }
  43. });
  44. this.infovisdiv = document.getElementById("entrelation-infovis");
  45. document.onkeydown=function(event){
  46. var e = event || window.event || arguments.callee.caller.arguments[0];
  47. if(e && e.keyCode==122){
  48. event.preventDefault?event.preventDefault():window.event.returnValue = false;
  49. if(!!window.ActiveXObject || "ActiveXObject" in window){//ie下F11不能用,屏蔽掉
  50. if($(".exit").length == 0){
  51. return;
  52. }
  53. }
  54. thisClass.initFullScreen();
  55. }else if(e && e.keyCode==27){
  56. event.preventDefault?event.preventDefault():window.event.returnValue = false;
  57. thisClass.cancelFullScreen();
  58. }
  59. };
  60. $(window).resize(function(){
  61. if(!thisClass.redrawflag){
  62. //1秒后重绘
  63. thisClass.redrawflag=true;
  64. setTimeout(thisClass.redraw,1000);
  65. }
  66. firstresize=false;
  67. });
  68. if(document.getElementById("entrelation-infovis")){
  69. document.getElementById("entrelation-infovis").oncontextmenu=function(){return false;};
  70. }
  71. $("#entrelation-fullscreen").attr("title","进入全屏视图"+((!!window.ActiveXObject || "ActiveXObject" in window)?"":" (F11)"));
  72. ///////////////////////关系网实例////////////////////////////
  73. var htmls="<div style='position:absolute;top:0px;' class='legend'>";
  74. htmls= htmls+ "<div class='legend-text-bg' style='margin-top: 10px;'><div style='background-color: #ff9800;'></div><span style='margin-left: 20px;'>本企业</span></div>";
  75. htmls= htmls+ "<div class='legend-text-bg' style='margin-top: 10px;'><div style='background-color: #cddc39;opacity:0.5;'></div><span style='margin-left: 12px;'>其他企业</span></div>";
  76. htmls= htmls+ "<div class='legend-text-bg' style='margin-top: 10px;'><div style='background-color: #2196f3;'></div><span style='margin-left: 25px;'>个人</span></div>";
  77. htmls= htmls+ "<div class='legend-text-bg' style='margin-top: 10px;margin-bottom: 10px;'><div style='background-color: #cecece;'></div><span style='margin-left: 5px;'>注吊销企业</span></div>";
  78. htmls= htmls+ "<div><span style='font-size: 20px;font-weight: bold;color: #cecece;'>→</span><span style=''>投资关系(股东→企业)</span></div>";
  79. htmls= htmls+ "<div><span style='font-size: 20px;font-weight: bold;color: #cd93d7;'>→</span><span style=''>法定代表人</span></div>";
  80. htmls= htmls+ "<div style='margin:10px 0px;' class='hidden-sm hidden-xs'><span class='text-muted'>提示:点击鼠标右键可以删除不想看的节点。</span></div>";
  81. htmls= htmls+"</div>"
  82. $("#entrelation").append(htmls);
  83. this.dataProcess();
  84. this.makeRelation();
  85. this.redraw();
  86. }
  87. Relation.prototype.dataProcess = function(){
  88. var reg = new RegExp(/(有限公司|有限责任公司|股份有限公司|总公司|分公司|公司|事务所|合伙企业)$|\(.*\)|\(.*\)/g);
  89. /*var provinces = [];
  90. $.ajax({
  91. url: "/js/provinceData.min.json",
  92. dataType: "json",
  93. cache: true,
  94. async: false,
  95. success: function(json){
  96. provinces = json;
  97. }
  98. });*/
  99. for(var i=0;i<this.data.nodes.length;i++){
  100. var nodeObj = this.data.nodes[i];
  101. nodeObj.text = $.trim(nodeObj.text);
  102. nodeObj.shortText = nodeObj.text;
  103. if(nodeObj.type == "e" || nodeObj.type == "ce"){
  104. var text = nodeObj.shortText;
  105. if(text.length > 2){//先替换结尾
  106. text = text.replace(reg,"");
  107. }
  108. if(text.length > 2){//再替换开头
  109. //text = this.filterEntName(text);
  110. }
  111. if(text.length > 2){//小于两个字符不生效
  112. nodeObj.shortText = text;
  113. }
  114. if(nodeObj.name == this.regno){//先找本企业位置
  115. this.index = i;
  116. nodeObj["regcap"] = (typeof(d1) == "undefined")?0:d1;
  117. nodeObj["legcerno"] = this.legcerNo;
  118. }
  119. }
  120. }
  121. /*********************************连线处理***********************************/
  122. var minLink=-1,maxLink=-1;
  123. for(var i=0;i<this.data.links.length;i++){
  124. var linkObj = this.data.links[i];
  125. if(linkObj.target==this.index && this.data.nodes[linkObj.source].name==this.legcerNo){
  126. //this.data.nodes[linkObj.source].type="cp";
  127. linkObj.type = "cp"
  128. linkObj.isLegal = 1;
  129. }
  130. //
  131. this.data.nodes[linkObj.target]["istarget"] = 1;
  132. if(this.data.nodes[linkObj.source].name == this.data.nodes[linkObj.target].invlegcerno || this.data.nodes[linkObj.source].name == this.data.nodes[linkObj.target].legcerno){
  133. linkObj.isLegal = 1;
  134. }
  135. if(typeof(linkObj.invacconam) == "undefined"){
  136. continue;
  137. }
  138. var invacconam = new Number(linkObj.invacconam);
  139. if(minLink == -1 && maxLink == -1){
  140. minLink = invacconam;
  141. maxLink = invacconam;
  142. }else if(invacconam > maxLink){
  143. maxLink = invacconam;
  144. }else if(invacconam < minLink){
  145. minLink = invacconam;
  146. }
  147. }
  148. /////////////
  149. var linkSectionArray = this.getLineSectionArray(minLink,maxLink);
  150. for(var i=0;i<this.data.links.length;i++){
  151. var linksObj = this.data.links[i];
  152. linksObj["linkVal"] = 2;
  153. if(typeof(linkObj.invacconam) == "undefined"){
  154. continue;
  155. }
  156. var invacconam = new Number(linksObj.invacconam);
  157. for(var s in linkSectionArray){
  158. var sectionObj = linkSectionArray[s];
  159. if(invacconam >= sectionObj.minVal && invacconam < sectionObj.maxVal){
  160. linksObj["linkVal"] = sectionObj.linkVal;
  161. continue;
  162. }
  163. }
  164. }
  165. /*********************************节点处理***********************************/
  166. var minNode=-1,maxNode=-1;
  167. for(var i=0;i<this.data.nodes.length;i++){
  168. var nodeObj = this.data.nodes[i];
  169. if(nodeObj.type == "e" || nodeObj.type == "ce"){
  170. var regcap = nodeObj.regcap;
  171. if(minNode == -1 && maxNode == -1){
  172. minNode = regcap;
  173. maxNode = regcap;
  174. }else if(regcap > maxNode){
  175. maxNode = regcap;
  176. }else if(regcap < minNode){
  177. minNode = regcap;
  178. }
  179. }
  180. }
  181. var nodeSectionArray = this.getNodeSectionArray(minNode,maxNode);
  182. for(var i=0;i<this.data.nodes.length;i++){
  183. var nodeObj = this.data.nodes[i];
  184. nodeObj["nodeVal"] = 7;
  185. if(nodeObj.type == "e" || nodeObj.type == "ce"){
  186. var invacconam = new Number(nodeObj.invacconam);
  187. var regcap = new Number(nodeObj.regcap);
  188. for(var s in nodeSectionArray){
  189. var sectionObj = nodeSectionArray[s];
  190. if(regcap >= sectionObj.minVal && regcap < sectionObj.maxVal){
  191. nodeObj["nodeVal"] = sectionObj.nodeVal;
  192. continue;
  193. }
  194. }
  195. }
  196. }
  197. //计算点之间的距离
  198. var chargeArray = [[0,10],[10,20],[20,30],[30,40],[40,50],[50,60],[60,70],[70,80],[80,90],[90,100],[100,110]];
  199. var nodeCount = this.data.nodes.length;
  200. for(var i in chargeArray){
  201. if(nodeCount >= chargeArray[i][0] && nodeCount < chargeArray[i][1]){
  202. this.chargeVal += i*100;
  203. break;
  204. }else if(i == chargeArray.length){
  205. this.chargeVal += i*100;
  206. }
  207. }
  208. }
  209. Relation.prototype.filterEntName = function(text){
  210. this.allProvinces = "河南省、青海省、山西省、黑龙江省、安徽省、广西壮族自治区、西藏自治区";
  211. this.commonReplace = function(t){
  212. if(t.length > 1 && text.startWith(t)){
  213. var textCopy = text.replace(new RegExp("^"+t),"");
  214. if(textCopy.length > 2){
  215. text = textCopy;
  216. }
  217. return true;
  218. }
  219. return false;
  220. };
  221. this.replaceStart = function(t,f){
  222. var flag = false;
  223. var minus = null;
  224. if(this.commonReplace(t)){//替换省、市、县、区
  225. return true;
  226. }
  227. if(f){//不替换
  228. flag = false;
  229. }else if(t.endWith("维吾尔自治区")){
  230. flag = true;
  231. minus = 6;
  232. }else if(t.endWith("回族自治区") || t.endWith("壮族自治区") || t.endWith("特别行政区")){
  233. flag = true;
  234. minus = 5;
  235. }else if(t.endWith("自治州") || t.endWith("自治县") || t.endWith("自治区")){
  236. flag = true;
  237. minus = 3;
  238. }else if(t.endWith("地区")){
  239. flag = true;
  240. minus = 2;
  241. }else if(t.endWith("省") || t.endWith("市") || t.endWith("区")){
  242. flag = true;
  243. minus = 1;
  244. }
  245. if(flag){
  246. return this.commonReplace(t.substring(0,t.length-minus));
  247. }
  248. return false;
  249. };
  250. this.replaceCity = function(citys){
  251. if(citys){
  252. for(var c in citys){//市
  253. var c_name = citys[c].n;
  254. if(this.replaceStart(c_name)){
  255. this.replaceAreas(citys[c].s);
  256. return true;
  257. }else if(this.replaceAreas(citys[c].s)){
  258. return true;
  259. }
  260. }
  261. }
  262. };
  263. this.replaceAreas = function(areas){
  264. if(areas){
  265. for(var a in areas){//县、区
  266. var a_name = areas[a].n;
  267. if(this.replaceStart(a_name,true)){
  268. return true;
  269. }
  270. }
  271. }
  272. };
  273. for(var p in provinces){//省
  274. var p_name = provinces[p].n;
  275. if(this.allProvinces.indexOf(p_name) == -1){
  276. continue;
  277. }
  278. if(this.replaceStart(p_name)){
  279. this.replaceCity(provinces[p].s);
  280. break;
  281. }else if(this.replaceCity(provinces[p].s)){
  282. break;
  283. }
  284. }
  285. return text;
  286. }
  287. Relation.prototype.getLineSectionArray = function(minLink,maxLink){
  288. var countSection = 6;
  289. var section = (maxLink - minLink) / countSection;
  290. var sectionArr = [];
  291. for(var i=2;i<=countSection;i++){
  292. var minVal = minLink;
  293. if(sectionArr.length > 0){
  294. minVal = sectionArr[sectionArr.length - 1].maxVal;
  295. }
  296. var maxVal = minLink+section*i;
  297. if(i == countSection){
  298. maxVal += section;
  299. }
  300. var sectionObj = {linkVal:i,minVal:minVal,maxVal:maxVal};
  301. sectionArr.push(sectionObj);
  302. }
  303. return sectionArr;
  304. }
  305. Relation.prototype.getNodeSectionArray = function(minNode,maxNode){
  306. var countSection = 7;
  307. var section = (maxNode - minNode) / countSection;
  308. var sectionArr = [];
  309. for(var i=1;i<=countSection;i++){
  310. var minVal = minNode;
  311. if(sectionArr.length > 0){
  312. minVal = sectionArr[sectionArr.length - 1].maxVal;
  313. }
  314. var maxVal = minNode+section*i;
  315. if(i == countSection){
  316. maxVal += section;
  317. }
  318. var sectionObj = {nodeVal:6+i,minVal:minVal,maxVal:maxVal};
  319. sectionArr.push(sectionObj);
  320. }
  321. return sectionArr;
  322. }
  323. Relation.prototype.launchFullScreen = function(element) {
  324. if(element){
  325. if (element.requestFullscreen) {
  326. element.requestFullscreen();
  327. } else if (element.msRequestFullscreen) {
  328. element.msRequestFullscreen();
  329. } else if (element.mozRequestFullScreen) {
  330. element.mozRequestFullScreen();
  331. } else if (element.webkitRequestFullscreen) {
  332. // 对 Chrome 特殊处理,
  333. // 参数 Element.ALLOW_KEYBOARD_INPUT 使全屏状态中可以键盘输入。
  334. if ( window.navigator.userAgent.toUpperCase().indexOf( 'CHROME' ) >= 0 ) {
  335. element.webkitRequestFullScreen( Element.ALLOW_KEYBOARD_INPUT );
  336. }else {
  337. // Safari 浏览器中,如果方法内有参数,则 Fullscreen 功能不可用。
  338. element.webkitRequestFullScreen();
  339. }
  340. }
  341. }
  342. }
  343. Relation.prototype.cancelFullScreen = function(){
  344. this.h = $("#entrelation-infovis").height();
  345. $("#entrelation-fullscreen").attr("title","进入全屏视图"+((!!window.ActiveXObject || "ActiveXObject" in window)?"":" (F11)"));
  346. //force.linkDistance(120).charge(-200).size([w,h]).resume();
  347. $("#entrelation-infovis").css({width:this.w,height:this.h});
  348. //设置svg标签的宽度与高度
  349. d3.select("svg").attr("width", this.w).attr("height", this.h);
  350. $(".entrelation-controlls").css({left:$("#entrelation").width()-$(".entrelation-controlls").width()-30});
  351. if(document.exitFullscreen) {
  352. document.exitFullscreen();
  353. } else if (document.msExitFullscreen) {
  354. document.msExitFullscreen();
  355. } else if (document.mozCancelFullScreen) {
  356. document.mozCancelFullScreen();
  357. } else if (document.webkitExitFullscreen) {
  358. document.webkitExitFullscreen();
  359. }
  360. }
  361. Relation.prototype.initFullScreen = function(){
  362. var thisClass = this;
  363. var fullscreenElement =
  364. document.fullscreenElement ||
  365. document.mozFullScreenElement ||
  366. document.webkitFullscreenElement ||
  367. document.msFullscreenElement;
  368. $(".entrelation-fullscreen").toggleClass("exit");
  369. if(!fullscreenElement || fullscreenElement==null){
  370. this.redrawflag = true;
  371. $("#entrelation-fullscreen").attr("title","退出全屏视图 (F11)");
  372. this.launchFullScreen(this.infovisdiv);
  373. var timeout = 100;
  374. if(!!window.ActiveXObject || "ActiveXObject" in window){
  375. timeout = 200;
  376. }
  377. setTimeout(function(){
  378. if(thisClass.force != null){
  379. //重绘
  380. var w=document.body.clientWidth;
  381. var h=document.body.clientHeight;
  382. //if(w>1200){
  383. //w= 1200
  384. //}
  385. $("#entrelation-infovis").css({width:w,height:h});
  386. d3.select("svg").attr("width", w).attr("height", h);
  387. $(".entrelation-controlls").css({left:w-$(".entrelation-controlls").width() - 70});
  388. thisClass.force.linkDistance(h).charge(-700).size([w,h]).resume();
  389. }
  390. },timeout);
  391. }else{
  392. this.cancelFullScreen();
  393. }
  394. }
  395. //重绘
  396. Relation.prototype.redraw = function(){
  397. if(this.force != undefined){
  398. d3.select("svg").attr("width",this.w).attr("height", this.h);
  399. this.force.size([this.w,this.h]).resume();
  400. $("#entrelation-infovis").css({width:this.w,height:this.h});
  401. //
  402. this.redrawflag = false;
  403. }
  404. }
  405. Relation.prototype.removeNode = function(obj){
  406. if(d3.event.which != 3){
  407. return;
  408. }
  409. this.highlightObject(obj,false);
  410. d3.select(obj).remove();
  411. var name = obj.__data__.name;
  412. var removeAloneNode = function(removeNodeName){
  413. var isRemoveAloneNode = true;
  414. d3.selectAll("path").each(function (i){
  415. if(removeNodeName == this.__data__.source.name || removeNodeName == this.__data__.target.name){
  416. isRemoveAloneNode = false;
  417. return true;
  418. }
  419. });
  420. if(isRemoveAloneNode){
  421. d3.selectAll("rect").each(function (){
  422. if(this.__data__.name == removeNodeName){
  423. d3.select(this).remove();
  424. return true;
  425. }
  426. });
  427. d3.selectAll("text").each(function (){
  428. if(this.__data__.name == removeNodeName){
  429. d3.select(this).remove();
  430. return true;
  431. }
  432. });
  433. }
  434. }
  435. d3.selectAll("path").each(function (){
  436. if(name == this.__data__.target.name){
  437. var fromNodeName = this.__data__.source.name;
  438. d3.select(this).remove();
  439. removeAloneNode(fromNodeName);
  440. }else if(name == this.__data__.source.name){
  441. var toNodeName = this.__data__.target.name;
  442. d3.select(this).remove();
  443. removeAloneNode(toNodeName);
  444. }
  445. });
  446. d3.selectAll("rect").each(function (){
  447. if(name == this.__data__.name){
  448. d3.select(this).remove();
  449. }
  450. });
  451. d3.selectAll("text").each(function (){
  452. if(name == this.__data__.name){
  453. d3.select(this).remove();
  454. }
  455. });
  456. }
  457. Relation.prototype.tick = function(e){
  458. var thisClass = this;
  459. this.lines.attr("d", function(d){
  460. var sy = d.source.y,
  461. x = d.target.x,
  462. y = d.target.y;
  463. if(sy > y){
  464. sy -= 12;
  465. }else{
  466. sy += 5;
  467. }
  468. var line = new geo.LineSegment(d.source.x, sy, x, y);
  469. for (var e in d.target.edge) {
  470. var ix = line.intersect(d.target.edge[e].offset(x, y));
  471. if (ix.in1 && ix.in2) {
  472. x = ix.x;
  473. y = ix.y;
  474. break;
  475. }
  476. }
  477. var dx = x - d.source.x,
  478. dy = y - sy,
  479. dr = Math.sqrt(dx * dx + dy * dy),
  480. theta = Math.atan2(dy, dx) + Math.PI / 7.85,
  481. d90 = Math.PI / 2,
  482. dtxs = x - Math.cos(theta),
  483. dtys = y - Math.sin(theta);
  484. return "M" + d.source.x + "," + sy + "A" + dr + "," + dr + " 0 0 1," + x + "," + y + "A" + dr + "," + dr + " 0 0 0," + d.source.x + "," + sy + "M" + dtxs + "," + dtys + "l" + (3.5 * Math.cos(d90 - theta) - 10 * Math.cos(theta)) + "," + (-3.5 * Math.sin(d90 - theta) - 10 * Math.sin(theta)) + "L" + (dtxs - 3.5 * Math.cos(d90 - theta) - 10 * Math.cos(theta)) + "," + (dtys + 3.5 * Math.sin(d90 - theta) - 10 * Math.sin(theta)) + "z";
  485. });
  486. this.nodes.attr("transform", function(d) {
  487. return "translate(" + d.x + "," + d.y + ")scale(" + thisClass.zoomlevel+ ")";
  488. });
  489. }
  490. Relation.prototype.zoomed = function() {
  491. this.svg.attr("transform",
  492. "translate(" + d3.event.translate + ")scale(" + d3.event.scale + ")");
  493. }
  494. Relation.prototype.highlightObject = function(obj,flag){
  495. if(this.mouseoverstatus){
  496. return;
  497. }
  498. if(!flag){
  499. d3.selectAll(".node").each(function (){
  500. d3.select(this).style("opacity","1");
  501. });
  502. d3.selectAll("path").each(function (){
  503. d3.select(this).style("opacity","1");
  504. });
  505. return;
  506. }
  507. var name = obj.__data__.name;
  508. d3.selectAll(".node").each(function (){
  509. if(name != this.__data__.name){
  510. d3.select(this).style("opacity","0.2");
  511. }
  512. });
  513. d3.selectAll("path").each(function (){
  514. var targetName = this.__data__.target.name;
  515. var sourceName = this.__data__.source.name;
  516. if(name != targetName && name != sourceName){
  517. d3.select(this).style("opacity","0.2");
  518. }else{
  519. d3.selectAll(".node").each(function (){
  520. if(targetName == this.__data__.name || sourceName == this.__data__.name){
  521. d3.select(this).style("opacity","1");
  522. }
  523. });
  524. }
  525. });
  526. }
  527. Relation.prototype.makeRelation = function(){
  528. var thisClass = this;
  529. this.force = d3.layout.force()
  530. .nodes(this.data.nodes)
  531. .links(this.data.links)
  532. .size([this.w, this.h])
  533. .linkDistance(function(p){
  534. return Math.floor(Math.random()*60)+90;
  535. })
  536. .chargeDistance(600)
  537. .charge(this.chargeVal)
  538. .linkStrength(1)
  539. .on('tick',function(){
  540. thisClass.tick();
  541. });
  542. var dragstatus = false;
  543. var drag = this.force.drag()
  544. .on("dragstart",function(d,i){
  545. d.fixed = true; //拖拽开始后设定被拖拽对象为固定
  546. d3.event.sourceEvent.stopPropagation(); // Prevent panning
  547. })
  548. .on("drag",function(d,i){
  549. dragstatus = true;
  550. thisClass.mouseoverstatus = true;
  551. })
  552. .on("dragend",function(d,i){
  553. thisClass.mouseoverstatus = false;
  554. setTimeout(function(){
  555. dragstatus = false;
  556. },500)
  557. });
  558. //处理缩放
  559. var zoom = d3.behavior.zoom().scaleExtent([0.4, 10]).on("zoom", function(){
  560. thisClass.zoomed();
  561. });
  562. this.svg = d3.select("#entrelation-infovis").append("svg:svg")
  563. .attr("width", this.w)
  564. .attr("height", this.h)
  565. .call(zoom)
  566. .append("g");
  567. this.lines = this.svg.append("svg:g")
  568. .selectAll("path")
  569. .data(this.force.links())
  570. .enter().append("path")
  571. .style("fill", function(p){
  572. return (p.type=="cp" || p.isLegal)?"#cd93d7":"#cecece";
  573. })
  574. .style("stroke", function(p){
  575. return (p.type=="cp" || p.isLegal)?"#cd93d7":"#cecece";
  576. })
  577. .attr("stroke-width",function (e,i){
  578. return e.linkVal;
  579. });
  580. this.lines.each(function (d,i){
  581. var invacconam = new Number(d.invacconam);
  582. if(invacconam > 0){
  583. var lenInvacconam = (invacconam + "").length;
  584. if(lenInvacconam > 4 && (invacconam + "").indexOf(".") > -1 && (lenInvacconam - (invacconam + "").indexOf(".")) > 4){
  585. invacconam = (new Number(invacconam)).toFixed(4);
  586. }
  587. d3.select(this).append("title").text("投资金额:"+invacconam+"万元");
  588. }
  589. });
  590. this.nodes = this.svg.append("svg:g")
  591. .selectAll(".node")
  592. .data(this.force.nodes())
  593. .enter()
  594. .append("g")
  595. .call(this.force.drag)
  596. .attr('class', 'node')
  597. .on('mouseover', function(d) {
  598. thisClass.highlightObject(this,true);
  599. })
  600. .on('mouseout', function(d) {
  601. thisClass.highlightObject(this,false);
  602. })
  603. .on("mousedown",function (e,i){
  604. d3.event.preventDefault();
  605. thisClass.removeNode(this);
  606. });
  607. this.nodes.append("rect")
  608. .attr("rx", 5)
  609. .attr("ry", 5)
  610. .attr('height', 20)
  611. .attr("fill", function(p){
  612. if(p.type == "e" && (p.opstate == "11" || p.opstate == "07")){
  613. return "#cecece";
  614. }
  615. return p.type=="p"?"#2196f3":p.type=="ce"?"#ff9800":"#cddc39";
  616. })
  617. .attr("stroke", function(p){
  618. if(p.type == "e" && (p.opstate == "11" || p.opstate == "07")){
  619. return "#cecece";
  620. }
  621. return p.type=="p"?"#2196f3":p.type=="ce"?"#ff9800":"#cddc39";
  622. }).style("opacity",function(p){
  623. if(p.type=="e" && (p.opstate != "11" || p.opstate != "07")){
  624. return "0.5";
  625. }
  626. return "1";
  627. });
  628. this.nodes.each(function (d,i){
  629. if(d.type == "ce" || d.type == "e"){
  630. var title = "";
  631. if(d.text != d.shortText){
  632. title = d.text;
  633. }
  634. var regcap = d.regcap;
  635. if(regcap > 0){
  636. var lenRegcap = (regcap + "").length;
  637. if(lenRegcap > 4 && (regcap + "").indexOf(".") > -1 && (lenRegcap - (regcap + "").indexOf(".")) > 4){
  638. regcap = (new Number(regcap)).toFixed(4);
  639. }
  640. if(title != ""){
  641. title += "\n";
  642. }
  643. title += "注册资本:"+regcap+"万元";
  644. }
  645. if(title != ""){
  646. d3.select(this).append("title").text(title);
  647. }
  648. }
  649. });
  650. this.nodes.append('text')
  651. .text(function(d){
  652. return d.shortText;
  653. })
  654. .style("cursor",function (d,i){
  655. if(d.type == "e"){
  656. return "pointer";
  657. }else{
  658. return "auto";
  659. }
  660. })
  661. .on("click",function (d,i){
  662. if(!dragstatus && d.type == "e"){
  663. window.open("/enterpriseInfoByRegNO/"+d.name+".html");
  664. }
  665. });
  666. setTimeout(function() {
  667. thisClass.nodes.each(function(d) {
  668. var node = d3.select(this),
  669. text = node.selectAll('text'),
  670. bounds = {},
  671. first = true;
  672. text.each(function() {
  673. var box = this.getBBox();
  674. if (first || box.x < bounds.x1) {
  675. bounds.x1 = box.x;
  676. }
  677. if (first || box.y < bounds.y1) {
  678. bounds.y1 = box.y;
  679. }
  680. if (first || box.x + box.width > bounds.x2) {
  681. bounds.x2 = box.x + box.width;
  682. }
  683. if (first || box.y + box.height > bounds.y2) {
  684. bounds.y2 = box.y + box.height;
  685. }
  686. first = false;
  687. }).attr('text-anchor', 'middle');
  688. var padding = {"left":3,"right":3,"top":2,"bottom":2},
  689. margin = {"left":3,"right":3,"top":2,"bottom":2},
  690. oldWidth = bounds.x2 - bounds.x1;
  691. bounds.x1 -= oldWidth / 2;
  692. bounds.x2 -= oldWidth / 2;
  693. bounds.x1 -= padding.left;
  694. bounds.y1 -= padding.top;
  695. bounds.x2 += padding.left + padding.right;
  696. bounds.y2 += padding.top + padding.bottom;
  697. var width = bounds.x2 - bounds.x1;
  698. var height = bounds.y2 - bounds.y1;
  699. node.select('rect')
  700. .attr('x', bounds.x1)
  701. .attr('y', bounds.y1)
  702. //.attr('height', height)
  703. .attr('width', width);
  704. d.edge = {
  705. left : new geo.LineSegment(bounds.x1, bounds.y1, bounds.x1, bounds.y2),
  706. right : new geo.LineSegment(bounds.x2, bounds.y1, bounds.x2, bounds.y2),
  707. top : new geo.LineSegment(bounds.x1, bounds.y1, bounds.x2, bounds.y1),
  708. bottom : new geo.LineSegment(bounds.x1, bounds.y2, bounds.x2, bounds.y2)
  709. };
  710. });
  711. thisClass.force.start();
  712. },10);
  713. //var diagonal = d3.svg.diagonal().projection(function(d) { return [d.y, d.x]; });
  714. }