チェンジセット 194 : SPARQLBuilderWWW/web/jsgui.html

差分発生行の前後
無視リスト:
更新日時:
2014/10/27 15:51:36 (10 年 前)
更新者:
lenz
ログメッセージ:

スタートクラス・エンドクラスの選択用インターフェースに表示用文字列を出す仕様に変更

1ファイルに描画系含め全ての関数等がある状態だったので描画関連メソッドを別ファイルに切り出し
jQueryを外部サイトから読み込んでいたがローカルから読み込む形に変更

ファイル:
1 変更

凡例:

変更なし
追加
削除
  • SPARQLBuilderWWW/web/jsgui.html

    r188 r194  
    88 
    99.link { 
    10   stroke: #999; 
    11   stroke-opacity: .6; 
    12 } 
    13 .tlink { 
    1410  stroke: #999; 
    1511  stroke-opacity: .6; 
     
    3733</style> 
    3834 
    39 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
     35<script type="text/javascript" src="jquery.min.js"></script> 
    4036<script type="text/javascript" src="d3.min.js"></script> 
    41 <!--<script type="text/javascript" src="http://lod.hozo.jp/SparqlFinder/js/template.js" charset="UTF-8"></script>--> 
     37<script type="text/javascript" src="drawgraph.js"></script> 
    4238<script> 
    4339<!-- 
     
    130126} 
    131127 
    132 // 謠冗判蜃ヲ逅� 
    133 function view_map(){ 
    134  
    135         // make_data繝。繧ス繝�ラ縺ョ邨先棡繧貞叙蠕� 
    136         var json = make_data(0); 
    137  
    138         // SVG縺悟ュ伜惠縺吶k縺ェ繧峨�蜑企勁 
    139         if (d3.select("#graph").select("svg")) { 
    140                 d3.select("#graph").select("svg").remove(); 
    141         } 
    142  
    143         if(json['nodes'].length != 0){ 
    144  
    145                 // 蜃コ譚・荳翫′縺」縺溽オ先棡繧呈ク。縺励※繝槭ャ繝嶺ク翫�繝ュ繧ア繝シ繧キ繝ァ繝ウ繧偵そ繝�ヨ 
    146                 set_map_location(0, json['nodes'], json['links']); 
    147  
    148                 // SVG縺ョ蟷�→鬮倥&繧定ィュ螳夲シ亥ケ�シ夂判髱「縺�▲縺ア縺�€€鬮倥&�壹ヱ繧ケ縺ョ謨ー縺ォ蠢懊§險ュ螳夲シ� 
    149                 var width = window.innerWidth; 
    150                 var height = ((NODEHEIGHT * 1.5) * PATHNUM) + (NODEHEIGHT / 2); 
    151  
    152                 // 繧ォ繝ゥ繝シ繧貞叙蠕� 
    153                 var color = d3.scale.category20(); 
    154  
    155                 // 逕サ髱「繧オ繧、繧コ縺ォ蜷医o縺婀VG縺ョ霑ス蜉 
    156                 var svg = d3.select("#graph").append("svg") 
    157                         .attr("width", width) 
    158                         .attr("height", height); 
    159  
    160                 // 閭梧勹縺ョ霑ス蜉 
    161                 var bg = svg 
    162                         .append("rect") 
    163                         .attr("x", 0) 
    164                         .attr("y", 0) 
    165                         .attr("width", width) 
    166                         .attr("height", height) 
    167                         .attr("fill", "#fafafa"); 
    168  
    169                 // links驟榊�繧呈ク。縺励Μ繝ウ繧ッ縺ョ菴懈� 
    170                 var link = svg.selectAll(".link") 
    171                         .data(json.links) 
    172                         .enter().append("line") 
    173                         .attr("class", "link") 
    174                         .style("stroke-width", function(d) { return Math.sqrt(d.value);}); 
    175  
    176                 // nodes驟榊�繧呈ク。縺励ヮ繝シ繝峨�菴懈� 
    177                 var node = svg.selectAll(".node") 
    178                         .data(json.nodes) 
    179                         .enter().append("circle") 
    180                         .attr("class", "node") 
    181                         .attr("r", (NODEHEIGHT / 2)) 
    182                         .attr("cx", function(d) { return d.x;} ) 
    183                         .attr("cy",  function(d) { return d.y; }) 
    184                         .style("stroke", function(d) { return '#fafafa'; }) 
    185                         .style("stroke-width", function(d) { return '1.5px'; }) 
    186                         .style("fill", function(d) { return color(d.group); }) 
    187                         .style("cursor", function(d) { return 'pointer'; }); 
    188  
    189                 // nodes驟榊�繧呈ク。縺励ヮ繝シ繝峨ユ繧ュ繧ケ繝医�菴懈� 
    190                 var tnode = svg.selectAll("text.node") 
    191                         .data(json.nodes) 
    192                         .enter().append("svg:text") 
    193                         .attr("class", "tnode") 
    194                         .attr("x", function(d) { return d.x; }) 
    195                         .attr("y", function(d) { return d.y; }) 
    196                         .text(function(d) { return d.name; }) 
    197                         .style("fill", function(d) { return '#000000'; }) 
    198                         .style("text-anchor", function(d) { return 'middle'; }) 
    199                         .style("pointer-events", "none"); 
    200  
    201                 // 繝ェ繝ウ繧ッ繝�く繧ケ繝医�菴懈� 
    202                 var tlink = svg.selectAll("text.link") 
    203                         .data(json.links) 
    204                         .enter().append("svg:text") 
    205                         .attr("class", "tlink") 
    206                         .attr("x", function(d) { return (json.nodes[d.source].x + json.nodes[d.target].x) / 2; }) 
    207                         .attr("y", function(d) { return (json.nodes[d.source].y + json.nodes[d.target].y) / 2; }) 
    208                         .style("fill", function(d) { return '#000000'; }) 
    209                         .style("text-anchor", function(d) { return 'middle'; }); 
    210  
    211                 // 繝弱�繝峨∈縺ョ繧ェ繝ウ繝槭え繧ケ縺ァ繝代せ謗「邏「縲√ヱ繧ケ荳ュ縺ョ繝ェ繝ウ繧ッ譁�ュ励r陦ィ遉コ 
    212                 node.on("mouseover", function(d){ 
    213  
    214                         // 繝槭え繧ケ縺ョ蜍輔″繧ォ繧ヲ繝ウ繝医r繝ェ繧サ繝�ヨ 
    215                         MOUSEMOVED = 0; 
    216  
    217                         // 陦ィ遉コ縺吶k繝代せ菫晏ュ倡畑驟榊� 
    218                         var path = []; 
    219                         // 繝��繝ォ繝√ャ繝励∈縺ョ蜷榊燕陦ィ遉コ逕ィ驟榊� 
    220                         var pathname = []; 
    221  
    222                         // 繝ォ繝シ繝医ヮ繝シ繝我サ・螟悶↑繧� 
    223                         if(d.nodeid != 0){ 
    224                                 // 縺セ縺壹が繝ウ繝槭え繧ケ縺輔l縺溘ヮ繝シ繝峨�id縺ィ蜷榊燕繧偵◎繧後◇繧瑚ソス蜉 
    225                                 path.push(d.nodeid); 
    226                                 pathname.push(d.name); 
    227  
    228                                 // 繝代せ謗「邏「 
    229                                 do{ 
    230                                         // 繝ェ繝ウ繧ッ縺ョ謨ー縺縺醍ケー繧願ソ斐@ 
    231                                         for(var i = 0; i < link.data().length; i++){ 
    232                                                 // 迴セ蝨ィ縺ョ譛€蠕悟ーセ縺ォ郢九′繧九Μ繝ウ繧ッ縺後≠繧後� 
    233                                                 if(path[(path.length-1)] == link.data()[i].target){ 
    234                                                         // 縺昴�繝ェ繝ウ繧ッ縺ョ繧ス繝シ繧ケ蛛エ繝弱�繝峨�id繧定ソス蜉 
    235                                                         path.push(link.data()[i].source); 
    236                                                         // 縺昴�繝ェ繝ウ繧ッ縺ョ蜷榊燕縺ィ繧ス繝シ繧ケ蛛エ繝弱�繝峨�蜷榊燕繧定ソス蜉 
    237                                                         pathname.push(link.data()[i].property); 
    238                                                         pathname.push(node.data()[link.data()[i].source].name); 
    239                                                 } 
    240                                         } 
    241                                 // 繝ォ繝シ繝医ヮ繝シ繝峨↓霎ソ繧顔捩縺上∪縺ァ郢ー繧願ソ斐☆ 
    242                                 }while(path[(path.length-1)] != 0); 
    243  
    244                                 // 譛ォ遶ッ繝弱�繝峨〒縺ェ縺�↑繧� 
    245                                 if(d.path == "notend"){ 
    246                                         // 繝��繝ォ繝√ャ繝励r髱櫁。ィ遉コ縺ォ 
    247                                         document.getElementById("showpath").style.display = "none"; 
    248                                 }else{ 
    249                                         // 譛ォ遶ッ繝弱�繝峨↑繧峨ヤ繝シ繝ォ繝√ャ繝励�諠�ア繧呈峩譁ー 
    250                                         var resultText = "<h3>Selected Path</h3>"; 
    251                                         // 繝代せ縺ョ蜷榊燕驟榊�蛻�セ後m縺九i郢ー繧願ソ斐@縺ェ縺後i 
    252                                         for (var i = pathname.length;i > 0; i--){ 
    253                                                 // 螂�焚逡ェ逶ョ�医ヮ繝シ繝峨�蜷榊燕�峨�螟ェ蟄励↓ 
    254                                                 if(i % 2 == 1){ 
    255                                                         resultText = resultText + "<span style=\"font-weight: bold;\">" + pathname[i - 1] + "</span><br><br>"; 
    256                                                 // 蛛カ謨ー逡ェ逶ョ�医Μ繝ウ繧ッ縺ョ蜷榊燕�峨�縺昴�縺セ縺セ縺ァ陦ィ遉コ 
    257                                                 }else{ 
    258                                                         resultText = resultText + pathname[i - 1] + "<br><br>"; 
    259                                                 } 
    260                                         } 
    261                                         // 繝��繝ォ繝√ャ繝励�蜀�ョケ繧呈嶌縺肴鋤縺� 
    262                                         document.getElementById("selectpath").innerHTML=(resultText); 
    263                                         document.getElementById("showpath").style.display = "block"; 
    264  
    265                                         // 繧オ繝シ繝悶Ξ繝�ヨ縺ォ騾√j霑斐☆繝代せ繧ェ繝悶ず繧ァ繧ッ繝医r菫晏ュ� 
    266                                         pathobj = d.path; 
    267  
    268                                         // 繝��繝ォ繝√ャ繝苓。ィ遉コ譎ゅ�蠎ァ讓呻シ医が繝ウ繝槭え繧ケ縺輔l縺溘ヮ繝シ繝峨�讓ェ縺ォ繝懊ち繝ウ縺梧擂繧九h縺��鄂ョ�� 
    269                                         var xPosition = parseFloat(d3.select(this).attr("cx")) + parseFloat(d3.select(this).style("stroke-width")) + (NODEHEIGHT * 0.5); 
    270                                         var yPosition = parseFloat(d3.select(this).attr("cy") - document.getElementById("showpath").offsetHeight + document.getElementById("menu").offsetHeight) + (NODEHEIGHT * 0.5); 
    271  
    272                                         // 繝��繝ォ繝√ャ繝励′逕サ髱「螟悶↓蜃コ縺ェ縺�h縺�」懈ュ」 
    273                                         if(xPosition < 0){ 
    274                                                 xPosition = 0; 
    275                                         } 
    276                                         if(yPosition < 0){ 
    277                                                 yPosition = 0; 
    278                                         } 
    279  
    280                                         // 逕滓�縺励◆蠎ァ讓吶↓繝��繝ォ繝√ャ繝励r陦ィ遉コ 
    281                                         document.getElementById("showpath").style.left = xPosition + "px" 
    282                                         document.getElementById("showpath").style.top = yPosition + "px" 
    283                                 } 
    284                         // 繝ォ繝シ繝医ヮ繝シ繝峨□縺」縺溘↑繧� 
    285                         }else{ 
    286                                 // 繝��繝ォ繝√ャ繝励r髱櫁。ィ遉コ 
    287                                 document.getElementById("showpath").style.display = "none"; 
    288                         } 
    289  
    290                         // 繧ェ繝ウ繝槭え繧ケ縺輔l縺溘ヮ繝シ繝峨�鬮倥&縺ォ隕ェ繧貞粋繧上○繧九◆繧√↓蜷医o縺帙k鬮倥&繧剃ソ晏ュ� 
    291                         var movey = d.y; 
    292  
    293                         // 蜷�ヮ繝シ繝峨↓蟇セ縺� 
    294                         node 
    295                                 // 霈ェ驛ュ邱壹�濶イ繧定ィュ螳� 
    296                                 .style("stroke", function(d){ 
    297                                         // 縺セ縺壹�閭梧勹濶イ�医ョ繝輔か繝ォ繝茨シ峨r謖�ョ� 
    298                                         var strokecolor = "#fafafa"; 
    299  
    300                                         // 繝代せ蛻、螳壹�蜑榊�逅� 
    301                                         // 陦ィ遉コ繝輔Λ繧ー縺系ow�亥燕蝗槭が繝ウ繝槭え繧ケ縺ァ蜍輔>縺ヲ縺�◆繝弱�繝会シ峨↑繧� 
    302                                         if(d.view == "now"){ 
    303                                                 // 繝弱�繝峨�陦ィ遉コ繝輔Λ繧ー繧地o縺ォ 
    304                                                 d.view = "no"; 
    305                                         } 
    306                                         // 陦ィ遉コ繝輔Λ繧ー縺稽oved�医け繝ェ繝�け縺輔l蝗コ螳壽ク医∩縺縺悟燕蝗槫虚縺�※縺�◆繝弱�繝会シ峨↑繧� 
    307                                         if(d.view == "moved"){ 
    308                                                 // 陦ィ遉コ繝輔Λ繧ー繧団licked縺ォ謌サ縺� 
    309                                                 d.view = "clicked"; 
    310                                         } 
    311  
    312                                         // 陦ィ遉コ繝輔Λ繧ー縺系o縺ョ繧ゅ�縺九i遒コ隱� 
    313                                         if(d.view == "no"){ 
    314                                                 // 繝代せ縺ョ繝弱�繝画焚縺縺醍ケー繧願ソ斐@縺ェ縺後i 
    315                                                 for(var n = 0; n < path.length; n++){ 
    316                                                         // 繝代せ蜀�↓蜷ォ縺セ繧後k繝弱�繝峨□縺」縺溘i 
    317                                                         if(path[n] == d.nodeid){ 
    318                                                                 // 霈ェ驛ュ邱壹r襍、縺ォ 
    319                                                                 strokecolor = "#ffaaaa"; 
    320                                                                 // 陦ィ遉コ繝輔Λ繧ー繧地ow�井サ雁屓蜍輔>縺溘ヮ繝シ繝会シ峨↓ 
    321                                                                 d.view = "now"; 
    322                                                         } 
    323                                                 } 
    324                                         // 蝗コ螳壽ク医∩繝弱�繝峨□縺」縺溘i 
    325                                         }else if(d.view == "clicked"){ 
    326                                                 // 縺セ縺壹�霈ェ驛ュ邱壹r襍、縺ォ 
    327                                                 strokecolor = "#ffaaaa"; 
    328                                                 // 繝代せ蜀�↓蜷ォ縺セ繧後k繝弱�繝峨°繝√ぉ繝�け 
    329                                                 for(var n = 0; n < path.length; n++){ 
    330                                                         if(path[n] == d.nodeid){ 
    331                                                                 // 蜷ォ縺セ繧後※縺�◆縺ェ繧我サ雁屓蜍輔°縺吶◆繧√ヵ繝ゥ繧ー繧知oved縺ォ 
    332                                                                 d.view = "moved"; 
    333                                                         } 
    334                                                 } 
    335                                         } 
    336  
    337                                         // 縺薙%縺セ縺ァ縺ァ蠕励i繧後◆霈ェ驛ュ邱壹�濶イ繧定ソ斐☆ 
    338                                         return strokecolor; 
    339                                 }) 
    340                                 // 鬮倥&縺ョ蛟、 
    341                                 .attr("cy", function(d){ 
    342                                         // 繝弱�繝峨′莉雁屓繧ェ繝ウ繝槭え繧ケ縺輔l縺溘�縺セ縺溘�蝗コ螳壽ク医∩縺縺檎ァサ蜍輔ヵ繝ゥ繧ー繧偵▽縺代i繧後※縺�l縺ー 
    343                                         if(d.view == "now" || d.view == "moved"){ 
    344                                                 // 迴セ蝨ィ縺ョ鬮倥&繧貞叙蠕� 
    345                                                 var curty = d.y; 
    346                                                 // d.y縺ォ蟄舌ヮ繝シ繝峨�鬮倥&繧偵そ繝�ヨ 
    347                                                 d.y = movey; 
    348                                                 // 迴セ蝨ィ縺ョ鬮倥&繧定ソ斐☆�医%縺ョ譎らせ縺ァ縺ッ迴セ蝨ィ菴咲スョ縺ォ謠冗判縺輔l縲〉edraw髢「謨ー縺ァd.y縺ォ繧「繝九Γ繝シ繧キ繝ァ繝ウ縺輔l繧具シ� 
    349                                                 return curty; 
    350                                         // 遘サ蜍募ッセ雎。縺ァ縺ェ縺�↑繧� 
    351                                         }else{ 
    352                                                 // 迴セ蝨ィ菴咲スョ繧偵◎縺ョ縺セ縺セ霑斐☆ 
    353                                                 return d.y; 
    354                                         } 
    355                                 }); 
    356  
    357                         // 蜷�Μ繝ウ繧ッ繝�く繧ケ繝医↓蟇セ縺� 
    358                         tlink 
    359                                 // 繝�く繧ケ繝郁。ィ遉コ蛻、螳� 
    360                                 .text(function(d) { 
    361                                         // 繝�ヵ繧ゥ繝ォ繝医〒遨コ繧偵そ繝�ヨ 
    362                                         var linktext = ""; 
    363                                         // 陦ィ遉コ繝輔Λ繧ー縺系ow�亥燕蝗櫁。ィ遉コ縺輔l縺ヲ縺�◆繝ェ繝ウ繧ッ�峨↑繧� 
    364                                         if(d.view == "now"){ 
    365                                                 // 陦ィ遉コ繝輔Λ繧ー繧定ァ」髯、 
    366                                                 d.view = "no"; 
    367                                         } 
    368  
    369                                         // 陦ィ遉コ繝輔Λ繧ー縺系o縺ェ繧� 
    370                                         if(d.view == "no"){ 
    371                                                 // 繝代せ縺ョ繝弱�繝画焚蛻�ケー繧願ソ斐@ 
    372                                                 for(var t = 0; t < path.length; t++){ 
    373                                                         // 閾ェ霄ォ縺後◎縺ョ繝弱�繝峨∈謗・邯壹@縺ヲ縺�k繝ェ繝ウ繧ッ�医°縺、縺昴�繝弱�繝峨′謚倥j縺溘◆縺セ繧後※縺�↑縺代l縺ー�� 
    374                                                         if(path[t] == d.target && node.data()[d.target].view != "hide"){ 
    375                                                                 // 繝ェ繝ウ繧ッ繝�く繧ケ繝医↓繝励Ο繝代ユ繧」縺ョ蛟、繧偵そ繝�ヨ 
    376                                                                 linktext = d.property 
    377                                                                 // 陦ィ遉コ繝輔Λ繧ー縺ォnow繧偵そ繝�ヨ 
    378                                                                 d.view = "now"; 
    379                                                         } 
    380                                                 } 
    381                                         // 陦ィ遉コ繝輔Λ繧ー縺掲ix�医け繝ェ繝�け縺輔l縺溘ヱ繧ケ縺ョ繝ェ繝ウ繧ッ�峨↑繧峨��医°縺、郢九′繧句�縺ョ繝弱�繝峨′謚倥j縺溘◆縺セ繧後※縺�↑縺代l縺ー�� 
    382                                         }else if(d.view == "fix" && node.data()[d.target].view != "hide"){ 
    383                                                 // 繝ェ繝ウ繧ッ繝�く繧ケ繝医↓繝励Ο繝代ユ繧」縺ョ蛟、繧偵そ繝�ヨ 
    384                                                 linktext = d.property 
    385                                         } 
    386                                         // 縺薙%縺セ縺ァ縺ァ縺ァ縺阪◆繝ェ繝ウ繧ッ繝�く繧ケ繝医r霑斐☆ 
    387                                         return linktext; 
    388                                 }); 
    389  
    390                         // 蜷�Μ繝ウ繧ッ縺ォ蟇セ縺� 
    391                         link 
    392                                 // 邱壹�濶イ蛻、螳� 
    393                                 .style("stroke", function(d){ 
    394                                         // 陦ィ遉コ繝輔Λ繧ー縺系o縺ェ繧峨� 
    395                                         if(d.view == "no"){ 
    396                                                 // 濶イ繧偵ョ繝輔か繝ォ繝医↓ 
    397                                                 return "#999"; 
    398                                         // 縺昴l莉・螟厄シ亥崋螳壹d繧ェ繝ウ繝槭え繧ケ縺輔l縺溘ヱ繧ケ縺ォ蜷ォ縺セ繧後k�峨↑繧� 
    399                                         }else{ 
    400                                                 // 濶イ繧定オ、縺ォ 
    401                                                 return "#ffaaaa"; 
    402                                         } 
    403                                 }); 
    404  
    405                         // 縺薙%縺セ縺ァ縺ョ險ュ螳壹r蜈�↓蜀肴緒逕サ 
    406                         redraw(); 
    407  
    408                 // 繝弱�繝峨∈縺ョ繧ッ繝ェ繝�け縺ァ驕ク謚槫崋螳壼喧�亥所縺ウ謚倥j逡ウ縺ソ蜃ヲ逅�シ� 
    409                 }).on("click", function(d){ 
    410  
    411                         // 蜷�ヮ繝シ繝峨↓蟇セ縺� 
    412                         node 
    413                                 // 霈ェ驛ュ邱壹�蛻、螳� 
    414                                 .style("stroke", function(d) { 
    415                                         // 繝�ヵ繧ゥ繝ォ繝医�濶イ繧偵そ繝�ヨ 
    416                                         var strokecolor = "#fafafa" 
    417                                         // 陦ィ遉コ繝輔Λ繧ー縺後が繝ウ繝槭え繧ケ荳ュ繝サ蝗コ螳壻クュ繝サ遘サ蜍穂クュ�磯∈謚槭&繧後※縺�k繝弱�繝会シ峨↑繧峨� 
    418                                         if(d.view == "now" || d.view == "clicked" || d.view == "moved"){ 
    419                                                 // 濶イ繧定オ、縺ォ 
    420                                                 strokecolor = "#ffaaaa" 
    421                                                 // 陦ィ遉コ繝輔Λ繧ー繧貞崋螳壻クュ縺ォ 
    422                                                 d.view = "clicked"; 
    423                                         } 
    424                                         // 縺薙%縺セ縺ァ縺ァ縺ァ縺阪◆濶イ繧定ソ斐☆ 
    425                                         return strokecolor; 
    426                                 }); 
    427  
    428                         // 縺薙%縺九i蟄舌ヮ繝シ繝峨�逡ウ縺ソ霎シ縺ソ蜃ヲ逅�シ育樟蝨ィ縺ッ蟒�ュ「縲∝ソオ縺ョ縺溘a繧ウ繝シ繝峨�谿九@縺ヲ縺翫¥�� 
    429                         /* 
    430                         var childs = []; 
    431                         var prevchilds = []; 
    432                         prevchilds.push(d.nodeid); 
    433  
    434                         // 
    435                         do{ 
    436                                 var tmpchilds = []; 
    437                                 var curchilds = []; 
    438                                 for(var p = 0; p < prevchilds.length; p++){ 
    439                                         tmpchilds = get_children(prevchilds[p], json['links']); 
    440                                         curchilds = curchilds.concat(tmpchilds); 
    441                                 } 
    442                                 prevchilds = curchilds; 
    443                                 childs = childs.concat(curchilds); 
    444  
    445                         }while(curchilds.length != 0); 
    446  
    447                         var childy = d.y; 
    448                         for(var c = 0; c < childs.length; c++){ 
    449                                 if(node.data()[childs[c]].y < childy){ 
    450                                         childy = node.data()[childs[c]].y; 
    451                                 } 
    452                         } 
    453  
    454                         d.y = childy; 
    455  
    456                         var maxdy = 0; 
    457                         var mindy = 0; 
    458  
    459                         for(var c = 0; c < childs.length; c++){ 
    460                                 if(node.data()[childs[c]].view != "hide"){ 
    461                                         var dy = node.data()[childs[c]].y - d.y; 
    462                                         if(dy > maxdy){ 
    463                                                 maxdy = dy; 
    464                                         } 
    465                                         node.data()[childs[c]].x = d.x; 
    466                                         node.data()[childs[c]].y = d.y; 
    467                                         node.data()[childs[c]].dy = dy; 
    468                                         node.data()[childs[c]].view = "hide"; 
    469                                         node.data()[childs[c]].hideparent = d.nodeid; 
    470                                 }else{ 
    471                                         if(node.data()[childs[c]].hideparent == d.nodeid){ 
    472                                                 node.data()[childs[c]].x = d.x + (TREESPACE * (node.data()[childs[c]].group - d.group)); 
    473                                                 node.data()[childs[c]].y = node.data()[childs[c]].y + node.data()[childs[c]].dy; 
    474                                                 if(-node.data()[childs[c]].dy < mindy){ 
    475                                                         mindy = -node.data()[childs[c]].dy; 
    476                                                 } 
    477                                                 node.data()[childs[c]].view = "appear"; 
    478                                                 node.data()[childs[c]].hideparent = -1; 
    479                                         } 
    480                                 } 
    481                         } 
    482  
    483                         node 
    484                         .attr("r", function(d){ 
    485                                 if(d.view == "appear"){ 
    486                                         d.view = "no"; 
    487                                 }else if(d.y > childy){ 
    488                                         d.y = d.y - maxdy - mindy; 
    489                                 } 
    490                                 if(d.view == "hide"){ 
    491                                         d.x = node.data()[d.hideparent].x; 
    492                                         d.y = node.data()[d.hideparent].y; 
    493                                 } 
    494                                 if(d.nodeid == 0){ 
    495                                         d.y = childy; 
    496                                 } 
    497                                 return (NODEHEIGHT / 2); 
    498                         }); 
    499                         */ 
    500  
    501                         // 蜷�Μ繝ウ繧ッ縺ォ蟇セ縺� 
    502                         tlink 
    503                                 // 繝�く繧ケ繝郁。ィ遉コ蛻、螳� 
    504                                 .text(function(d) { 
    505                                         // 繝�ヵ繧ゥ繝ォ繝医〒遨コ縺ォ 
    506                                         var linktext = ""; 
    507                                         // 陦ィ遉コ繝輔Λ繧ー縺檎樟蝨ィ陦ィ遉コ荳ュ縺セ縺溘�蝗コ螳壼喧貂医∩縺ェ繧峨��医°縺、謚倥j逡ウ縺ソ荳ュ縺ァ縺ェ縺代l縺ー�� 
    508                                         if((d.view == "now" || d.view == "fix") && (node.data()[d.target].view != "hide")){ 
    509                                                 // 繝ェ繝ウ繧ッ繝�く繧ケ繝医↓繝励Ο繝代ユ繧」縺ョ蛟、繧偵そ繝�ヨ 
    510                                                 linktext = d.property 
    511                                                 // 陦ィ遉コ繝輔Λ繧ー繧貞崋螳壻クュ縺ォ 
    512                                                 d.view = "fix"; 
    513                                         } 
    514                                         // 繝�く繧ケ繝医r霑斐☆ 
    515                                         return linktext; 
    516                                 }); 
    517  
    518                         // 縺薙%縺セ縺ァ縺ョ蜃ヲ逅�オ先棡繧貞�縺ォ蜀肴緒逕サ 
    519                         redraw(); 
    520  
    521                 }); 
    522  
    523                 // 蜀肴緒逕サ髢「謨ー 
    524                 var redraw = function (duration){ 
    525  
    526                         // 縺九¢繧区凾髢薙′譛ェ謖�ョ壹↑繧峨� 
    527                         if(duration == undefined){ 
    528                                 // 0.5遘偵°縺代※繧「繝九Γ繝シ繧キ繝ァ繝ウ 
    529                                 duration = 500; 
    530                         } 
    531  
    532                         // 蜷�Μ繝ウ繧ッ縺ォ縺、縺�※險ュ螳壹&繧後◆菴咲スョ縺ォ蜀肴緒逕サ 
    533                         link 
    534                                 .transition() 
    535                                 .duration(duration) 
    536                                 .attr("x1", function(d) {return node.data()[d.source].x;}) 
    537                                 .attr("y1", function(d) {return node.data()[d.source].y;}) 
    538                                 .attr("x2", function(d) {return node.data()[d.target].x;}) 
    539                                 .attr("y2", function(d) {return node.data()[d.target].y;}); 
    540  
    541                         // 蜷�Μ繝ウ繧ッ繝�く繧ケ繝医↓縺、縺�※險ュ螳壹&繧後◆菴咲スョ縺ォ蜀肴緒逕サ 
    542                         tlink 
    543                                 .transition() 
    544                                 .duration(duration) 
    545                                 .attr("x", function(d) {return (node.data()[d.source].x + node.data()[d.target].x) / 2;}) 
    546                                 .attr("y", function(d) {return ((node.data()[d.source].y + node.data()[d.target].y) / 2) + 5;}); 
    547  
    548                         // 蜷�ヮ繝シ繝峨↓縺、縺�※險ュ螳壹&繧後◆菴咲スョ縺ォ蜀肴緒逕サ�医°縺、謚倥j縺溘◆縺セ繧御クュ縺ョ蝣エ蜷医�謠冗判蛻�イ仙�逅�シ� 
    549                         node 
    550                                 .transition() 
    551                                 .duration(duration) 
    552                                 .attr("cx", function(d) {return d.x;}) 
    553                                 .attr("cy", function(d) {return d.y;}) 
    554                                 .style("opacity", function(d){ 
    555                                         var opa = 1.0; 
    556                                         if(d.view == "hide"){ 
    557                                                 opa = 0.0; 
    558                                         } 
    559                                         return opa; 
    560                                 }) 
    561                                 .style("fill", function(d) { 
    562                                         var fcolor = color(d.group); 
    563  
    564                                         for(var n = 0; n < node.data().length; n++){ 
    565                                                 if(d.nodeid == node.data()[n].hideparent){ 
    566                                                         fcolor = "ffaaaa"; 
    567                                                 } 
    568                                         } 
    569                                         return fcolor; 
    570                                 }) 
    571                                 .style("pointer-events", function(d){ 
    572                                         var pe = "auto"; 
    573                                         if(d.view == "hide"){ 
    574                                                 pe = "none"; 
    575                                         } 
    576                                         return pe; 
    577                                 }); 
    578  
    579                         // 蜷�ヮ繝シ繝峨ユ繧ュ繧ケ繝医↓縺、縺�※險ュ螳壹&繧後◆菴咲スョ縺ォ蜀肴緒逕サ縲√ユ繧ュ繧ケ繝域緒逕サ菴咲スョ繧剃ク贋ク九↓謖ッ繧具シ医°縺、謚倥j縺溘◆縺セ繧御クュ縺ョ蝣エ蜷医�謠冗判蛻�イ仙�逅�シ� 
    580                         tnode 
    581                         .transition() 
    582                         .duration(duration) 
    583                         .attr("x", function(d) {return d.x;}) 
    584                         .attr("y", function(d) { 
    585                                 // 繝�ヵ繧ゥ繝ォ繝医〒蟆代@荳九£繧� 
    586                                 var updown = (NODEHEIGHT * 0.4); 
    587                                 // 螂�焚逡ェ逶ョ縺ョ豺ア縺輔↑繧牙ー代@荳翫£繧� 
    588                                 if(d.group % 2 == 1){ 
    589                                         updown = -(NODEHEIGHT * 0.2); 
    590                                 } 
    591                                 // 縺昴�蛟、繧帝ォ倥&縺ォ霑斐☆縺薙→縺ァ繝�く繧ケ繝域緒逕サ菴咲スョ縺御コ偵>驕輔>縺ォ縺ェ繧� 
    592                                 return d.y + updown; 
    593                         }) 
    594                         // 謚倥j逡ウ縺ソ迥カ諷九↑繧峨ユ繧ュ繧ケ繝郁。ィ遉コ繧呈カ医☆ 
    595                         .text(function(d){ 
    596                                 var nodetext = d.name 
    597                                 if(d.view == "hide"){ 
    598                                         nodetext = ""; 
    599                                 } 
    600                                 return nodetext; 
    601                         }); 
    602  
    603                 }; 
    604  
    605                 // 閭梧勹驛ィ蛻�′繧ッ繝ェ繝�け縺輔l縺溘i陦ィ遉コ縺ョ蝗コ螳壼喧繧定ァ」髯、 
    606                 bg.on("click", function() { 
    607                         // 繝��繝ォ繝√ャ繝励r髱櫁。ィ遉コ 
    608                         document.getElementById("showpath").style.display = "none"; 
    609                         d3.selectAll(".node").style("stroke-width", function(d) { return '1.5px'; }); 
    610                         d3.selectAll(".node").style("stroke", function(d) { return '#ffffff'; }); 
    611  
    612                         // 蜷�ヮ繝シ繝峨�霈ェ驛ュ邱壹�濶イ繧偵ョ繝輔か繝ォ繝医↓ 
    613                         node 
    614                                 .style("stroke", function(d){ 
    615                                         if(d.view != "hide"){ 
    616                                                 d.view = "no"; 
    617                                         } 
    618                                         return "#fafafa"; 
    619                                 }); 
    620  
    621                         // 繝ェ繝ウ繧ッ繝�く繧ケ繝医r蜈ィ縺ヲ遨コ縺ォ 
    622                         tlink 
    623                                 .text(function(d) { 
    624                                         d.view = "no"; 
    625                                         return ""; 
    626                                 }); 
    627  
    628                         // 繝ェ繝ウ繧ッ縺ョ濶イ繧貞�縺ヲ繝�ヵ繧ゥ繝ォ繝医↓ 
    629                         link 
    630                                 .style("stroke", function(d){ 
    631                                         return "#999"; 
    632                                 }); 
    633  
    634                 }); 
    635  
    636                 // 閭梧勹荳翫〒繝槭え繧ケ縺悟虚縺上#縺ィ縺ォ 
    637                 bg.on("mousemove", function(){ 
    638                         // MOUSEMOVED繧定ソス蜉�医ヮ繝シ繝峨↓繧ェ繝ウ繝槭え繧ケ縺輔l繧句コヲ縺ォ繧ォ繧ヲ繝ウ繝医Μ繧サ繝�ヨ�� 
    639                         MOUSEMOVED++; 
    640                         // 30繧定カ�∴縺溘i 
    641                         if(MOUSEMOVED > 30){ 
    642                                 // 繝��繝ォ繝√ャ繝励r髱櫁。ィ遉コ縺ォ縺励※繧ォ繧ヲ繝ウ繝医Μ繧サ繝�ヨ 
    643                                 document.getElementById("showpath").style.display = "none"; 
    644                                 MOUSEMOVED = 0; 
    645                         } 
    646                 }); 
    647  
    648                 // 蛻晏屓縺ョ縺ソduration繧�縺ィ謖�ョ壹@蜀肴緒逕サ�医い繝九Γ繝シ繧キ繝ァ繝ウ縺ェ縺暦シ� 
    649                 redraw(0); 
    650         } 
    651 } 
    652  
    653 // 繝��繧ソ縺ョ菴懈�繝。繧ス繝�ラ 
    654 function make_data(tdepth, ret, parent, depth){ 
    655         // ret縺梧悴螳夂セゥ縺ェ繧峨�螳夂セゥ縺励※莉」蜈・ 
    656         if (ret == undefined){ 
    657                 ret = new Object(); 
    658                 ret['nodes'] = new Array(); 
    659                 ret['links'] = new Array(); 
    660         } 
    661  
    662         PATHNUM = 0; 
    663         MAXDEPTH = 0; 
    664         TREESPACE = 0; 
    665         DRAWHEIGHT = NODEHEIGHT; 
    666  
    667         var viewnum; 
    668  
    669         var obj = JSON.parse(jsontext); 
    670  
    671         document.getElementById("resultmessage").style.color = "black"; 
    672         document.getElementById("resultmessage").style.fontWeight = "normal"; 
    673  
    674         document.getElementById("plural").innerHTML = "s"; 
    675  
    676         if(obj['paths'].length == 0){ 
    677                 document.getElementById("resultmessage").style.color = "red"; 
    678                 document.getElementById("resultmessage").style.fontWeight = "bold"; 
    679                 document.getElementById("plural").innerHTML = ""; 
    680         }else if(obj['paths'].length == 1){ 
    681                 document.getElementById("plural").innerHTML = ""; 
    682         } 
    683  
    684         if(obj['paths'].length <= 10){ 
    685                 viewnum = obj['paths'].length; 
    686                 document.getElementById("viewall").style.display = "none"; 
    687         }else if(pathlimit == 10){ 
    688                 viewnum = 10; 
    689                 document.getElementById("viewall").style.display = "block"; 
    690         }else{ 
    691                 viewnum = obj['paths'].length; 
    692                 document.getElementById("viewall").style.display = "none"; 
    693         } 
    694  
    695         document.getElementById("pathnum").innerHTML = obj['paths'].length; 
    696         document.getElementById("resultmessage").style.display = "block"; 
    697  
    698         // obj繝医ャ繝鈴嚴螻、縺ョ謨ー縺縺醍ケー繧願ソ斐@縺ェ縺後i 
    699         for(var i = 0; i < viewnum; i++){ 
    700                 if(i == 0){ 
    701                         // 蛻晏屓縺縺代Ν繝シ繝医ヮ繝シ繝峨r繝励ャ繧キ繝・ 
    702                         ret['nodes'].push({'name': obj['paths'][0]['startClassLabel'], 'uri': obj['paths'][0]['startClassURI'], 'group': 0, 'x':50, 'y':50, 'nodeid':ret['nodes'].length, 'view' : 'no', 'path': 'notend'}); 
    703                 } 
    704                 // 蜈医↓source縺ォ0�医Ν繝シ繝茨シ峨r莉」蜈・ 
    705                 var source = 0; 
    706                 // 蜈ア騾壹Ν繝シ繝亥愛螳壹rtrue縺ォ 
    707                 var isCommon = true; 
    708  
    709                 // classLinks縺ョ謨ー縺縺醍ケー繧願ソ斐@縺ェ縺後i 
    710                 for(var j = 0;j < obj['paths'][i]['classLinks'].length; j++){ 
    711  
    712                         // 繝ェ繝ウ繧ッ縺ョ蜷榊燕繧旦RL譛ォ蟆セ縺九i蜿門セ� 
    713                         var propertytext = obj['paths'][i]['classLinks'][j]['propertyURI']; 
    714                         var propertysplit1 = propertytext.split("/"); 
    715                         var propertysplit2 = propertysplit1[propertysplit1.length - 1]; 
    716                         var propertysplit3 = propertysplit2.split("#"); 
    717                         propertytext = propertysplit3[propertysplit3.length - 1]; 
    718  
    719                         if(MAXDEPTH < j+1){ 
    720                                 MAXDEPTH = j+1; 
    721                         } 
    722                         // 縺薙%縺セ縺ァ蜈ア騾壹Ν繝シ繝医↑繧� 
    723                         if(isCommon){ 
    724                                 // 莉雁屓繧ょ�騾壹°遒コ隱阪☆繧九◆繧√�繝輔Λ繧ー 
    725                                 var isCommonNow = false; 
    726                                 // nodes驟榊�縺ォ蜷後§linkedClass縺梧里縺ォ縺ゅk縺狗「コ隱� 
    727                                 var targets = []; 
    728                                 for(var k = 0; k < ret['nodes'].length; k++){ 
    729                                         // 蜷碁嚴螻、縺九▽蜷後§蜷榊燕縺ョ繧ゅ�縺後≠縺」縺溘itargets驟榊�縺ォ逡ェ蜿キ繧定ソス蜉 
    730                                         if(ret['nodes'][k]['group'] == (j+1) && obj['paths'][i]['classLinks'][j]['linkedClassURI'] == ret['nodes'][k]['uri']){ 
    731                                                 targets.push(k); 
    732                                         } 
    733                                 } 
    734  
    735                                 // 譌「縺ォ縺ゅ▲縺溷エ蜷医�links驟榊�縺ォ蜷後§link縺悟ュ伜惠縺吶k縺狗「コ隱� 
    736                                 if(targets.length != 0){ 
    737                                         // 蜈医⊇縺ゥ隕九▽縺代◆targets縺ョ謨ー縺縺醍ケー繧願ソ斐@縺ェ縺後i 
    738                                         for(var l = 0; l <targets.length; l++){ 
    739                                                 // links驟榊�縺ォ蜈ィ縺丞酔縺俶擅莉カ縺ョ繧ゅ�縺後≠繧九°遒コ隱� 
    740                                                 for(var m = 0; m < ret['links'].length; m++){ 
    741                                                         // 縺ゅ▲縺溷エ蜷井サ雁屓縺ョ繧ゅ�縺ッ霑ス蜉縺帙★source繧呈峩譁ー縺励※谺。縺ク 
    742                                                         if(ret['links'][m]['source'] == source && ret['links'][m]['target'] == targets[l] && ret['links'][m]['uri'] == obj['paths'][i]['classLinks'][j]['propertyURI'] && !isCommonNow){ 
    743                                                                 // 蜈ア騾壹Ν繝シ繝医ヵ繝ゥ繧ー繧偵が繝ウ 
    744                                                                 isCommonNow = true; 
    745                                                                 source = targets[l]; 
    746                                                         } 
    747                                                 } 
    748                                         } 
    749  
    750                                         // 蜷дarget繧堤「コ隱阪@縺ヲ蜈ア騾壹Ν繝シ繝医〒縺ッ縺ェ縺九▲縺溷エ蜷域眠隕剰ソス蜉 
    751                                         if(!isCommonNow){ 
    752                                                 isCommon = false; 
    753                                                 ret['nodes'].push({'name': obj['paths'][i]['classLinks'][j]['nodeLabel'], 'uri': obj['paths'][i]['classLinks'][j]['linkedClassURI'], 'group': (j+1), 'x':0, 'y':0, 'dy':0, 'nodeid':ret['nodes'].length, 'view' : 'no', 'path': 'notend'}); 
    754                                                 ret['links'].push({'source':source, 'target':ret['nodes'].length - 1, 'value':5, 'property': propertytext, 'uri': obj['paths'][i]['classLinks'][j]['propertyURI'], 'view' : 'no'}); 
    755                                                 source = ret['nodes'].length - 1; 
    756                                         } 
    757  
    758                                 // 縺ェ縺九▲縺溷エ蜷医�蛻・譚。莉カ縺ェ縺ョ縺ァ譁ー隕剰ソス蜉縺励※谺。縺ク 
    759                                 }else{ 
    760  
    761                                         isCommon = false; 
    762                                         ret['nodes'].push({'name': obj['paths'][i]['classLinks'][j]['nodeLabel'], 'uri': obj['paths'][i]['classLinks'][j]['linkedClassURI'], 'group': (j+1), 'x':0, 'y':0, 'dy':0, 'nodeid':ret['nodes'].length, 'view' : 'no', 'path': 'notend'}); 
    763                                         ret['links'].push({'source':source, 'target':ret['nodes'].length - 1, 'value':5, 'property': propertytext, 'uri': obj['paths'][i]['classLinks'][j]['propertyURI'], 'view' : 'no'}); 
    764                                         source = ret['nodes'].length - 1; 
    765                                 } 
    766                         // 譌「縺ォ蜈ア騾壹Ν繝シ繝医〒縺ェ縺�↑繧画眠隕剰ソス蜉縺励※谺。縺ク 
    767                         }else{ 
    768                                 ret['nodes'].push({'name': obj['paths'][i]['classLinks'][j]['nodeLabel'], 'uri': obj['paths'][i]['classLinks'][j]['linkedClassURI'], 'group': (j+1), 'x':0, 'y':0, 'dy':0, 'nodeid':ret['nodes'].length, 'view' : 'no', 'path': 'notend'}); 
    769                                 ret['links'].push({'source':source, 'target':ret['nodes'].length - 1, 'value':5, 'property': propertytext, 'uri': obj['paths'][i]['classLinks'][j]['propertyURI'], 'view' : 'no'}); 
    770                                 source = ret['nodes'].length - 1; 
    771                         } 
    772  
    773                 } 
    774                 ret['nodes'][ret['nodes'].length - 1]['path'] = obj['paths'][i]; 
    775                 PATHNUM++; 
    776         } 
    777         TREESPACE = (window.innerWidth - 200) / (MAXDEPTH + 1); 
    778  
    779         // 縺ァ縺阪◆邨先棡繧定ソ斐☆ 
    780         return ret; 
    781 } 
    782  
    783 // 逕滓�縺輔l縺溘ョ繝シ繧ソ縺ョ螳滄圀縺ョ繝ュ繧ア繝シ繧キ繝ァ繝ウ繧定ィ育ョ励☆繧九Γ繧ス繝�ラ�亥�蝗槭�myNodeIndex縺�縲]odes縺ォ逕滓�縺輔l縺殤odes驟榊�縲〕inks縺ォ逕滓�縺輔l縺殕inks驟榊�縺梧ク。縺輔l繧具シ� 
    784 function set_map_location(myNodeIndex, nodes, links, depth, fromAngle, toAngle){ 
    785  
    786         // depth縺梧悴螳夂セゥ縺ェ繧峨�0繧偵そ繝�ヨ 
    787         if (depth == undefined){ 
    788                 depth = 0; 
    789         } 
    790  
    791         // 蜷�ィョ蛻晄悄蛹� 
    792         var children = undefined; 
    793         var parent = undefined; 
    794         var parentsChildren = undefined; 
    795  
    796         // links驟榊�縺ョ謨ー縺縺醍ケー繧願ソ斐@縺ェ縺後i 
    797         for (var i=0; i<links.length; i++){ 
    798                 // 縺昴�links縺ョtarget縺稽yNodeIndex縺ェ繧英arent繧偵そ繝�ヨ 
    799                 if (links[i].target == myNodeIndex){ 
    800                         parent = links[i].source; 
    801                 } 
    802         } 
    803  
    804         // parent縺瑚ヲ九▽縺九▲縺ヲ縺�◆縺ェ繧峨� 
    805         if (parent != undefined){ 
    806                 // parent縺ィlinks繧呈ク。縺揚et_children繝。繧ス繝�ラ繧貞ョ溯。� 
    807                 parentsChildren = get_children(parent, links); 
    808         } 
    809  
    810         if(myNodeIndex != 0){ 
    811                 DRAWHEIGHT += (NODEHEIGHT * 1.5); 
    812                 var x = (depth * TREESPACE) + (TREESPACE / 3); 
    813                 var y = DRAWHEIGHT; 
    814                 nodes[myNodeIndex].x = x; 
    815                 nodes[myNodeIndex].y = y; 
    816         }else{ 
    817                 var x = TREESPACE / 2; 
    818                 var y = (NODEHEIGHT * 1.5) * ((PATHNUM - 1) / 2) + NODEHEIGHT; 
    819                 nodes[myNodeIndex].x = x; 
    820                 nodes[myNodeIndex].y = y; 
    821         } 
    822  
    823         children = get_children(myNodeIndex, links); 
    824  
    825         for (var i=0; i<children.length; i++){ 
    826                 if(i == 0){ 
    827                         DRAWHEIGHT -= (NODEHEIGHT * 1.5); 
    828                 } 
    829                 var child = children[i]; 
    830                 set_map_location(child, nodes, links, depth+1, fromAngle + ((toAngle - fromAngle) / children.length) * i, fromAngle + ((toAngle - fromAngle) / children.length) * (i+1)); 
    831         } 
    832  
    833 } 
    834  
    835 // 謖�ョ壹&繧後◆隕ェ縺梧戟縺、蟄舌r霑斐☆ 
    836 function get_children(index, links){ 
    837         var children = new Array(); 
    838         // links縺ョ謨ー縺縺醍「コ隱阪@縺ェ縺後i 
    839         for (var i=0; i<links.length; i++){ 
    840                 // 隕ェ縺梧ク。縺輔l縺溯ヲェ縺ィ荳€閾エ縺吶k譎ゅ�蟄舌r霑ス蜉 
    841                 if (links[i].source == index){ 
    842                         children.push(links[i].target); 
    843                 } 
    844         } 
    845         return children; 
    846 } 
    847  
    848 // ZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZN 
    849 // ZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZNZN 
    850  
    851128function setEndpoints(ep){ 
    852129        for (var i = 0; i < ep.length; i++){ 
     
    877154                        $("*[name=endclass] option").remove(); 
    878155                        for (var i = 0; i < epclass.length; i++){ 
    879                                 $("*[name=startclass]").append('<option value="' + epclass[i] + '">' + epclass[i]); 
    880                                 $("*[name=endclass]").append('<option value="' + epclass[i] + '">' + epclass[i]); 
     156                                $("*[name=startclass]").append('<option value="' + epclass[i]["uri"] + '">' + epclass[i]{"display"}); 
     157                                $("*[name=endclass]").append('<option value="' + epclass[i]["uri"] + '">' + epclass[i]["display"]); 
    881158                        } 
    882159                        ajaxload("hide");