2012-07-30 98 views
1

我遇到TypeError對象不支持IE8方法msg的這個屬性。IE8 TypeError對象不支持方法的這個屬性

我使用的JavaScript protovis繪製節點和鏈接(即,圖形)

源是以下,我ansolutely無能。

任何提示?

<h2>Topology</h2> 


<!--<script src="/static/media/js/jquery.tipsy.js"></script>--> 
<script src="/static/media/js/tooltip.topology.js"></script> 
<link rel="stylesheet" type="text/css" href="/static/media/css/tooltip.topology.css" /> 
<link rel="stylesheet" type="text/css" href="/static/media/css/tooltip.css" /> 

</script> 

<script type="text/javascript+protovis"> 
/* ProtoVIS data */ 

var data = { 
    nodes: [ 

     {nodeValue:"31", nodeName:"00:0a:00:26:f1:3c:9d:40", group:"0", 


      nodeConnections:[{'target_datapath': '00:0a:00:26:f1:3d:a5:40', 'src_port': '21', 'target_port': '22'}, {'target_datapath': '0a:90:c0:91:34:35:ef:00', 'src_port': '23', 'target_port': '47'}, {'src_port': '22', 'target_datapath': '00:0a:00:26:f1:45:1d:c0', 'target_port': '21'}] 

     }, 

     {nodeValue:"38", nodeName:"00:0a:00:26:f1:3d:a5:40", group:"0", 


      nodeConnections:[{'src_port': '22', 'target_datapath': '00:0a:00:26:f1:3c:9d:40', 'target_port': '21'}] 

     }, 

     {nodeValue:"25", nodeName:"00:0a:00:26:f1:45:1d:c0", group:"0", 


      nodeConnections:[{'target_datapath': '00:0a:00:26:f1:45:3c:c0', 'src_port': '23', 'target_port': '21'}, {'target_datapath': '00:0a:00:26:f1:3c:9d:40', 'src_port': '21', 'target_port': '22'}] 

     }, 

     {nodeValue:"20", nodeName:"00:0a:00:26:f1:45:3c:c0", group:"0", 


      nodeConnections:[{'src_port': '21', 'target_datapath': '00:0a:00:26:f1:45:1d:c0', 'target_port': '23'}] 

     }, 

     {nodeValue:"1", nodeName:"0a:90:c0:91:34:35:ef:00", group:"0", 


      nodeConnections:[{'src_port': '47', 'target_datapath': '00:0a:00:26:f1:3c:9d:40', 'target_port': '23'}] 

     }, 

     {nodeValue:"b3036750-27ab-49b6-8f69-abc4e75dcd58", nodeName:"smartx-node-1", group:"1", 

      nodeVms: ['VM6'], 
      nodeVmInterfaces: [{'switch': '0a:90:c0:91:34:35:ef:00', 'port': '39', 'name': 'eth1'}] 


     }, 

     {nodeValue:"e79fb114-7dd7-4164-8eb7-364afa303ee9", nodeName:"smartx-jeju", group:"1", 

      nodeVms: ['VMJeju1'], 
      nodeVmInterfaces: [] 


     } 

    ], 
    links: [ 

     {source:1, target:0, value:"rsc_id_42-rsc_id_34"}, 

     {source:3, target:2, value:"rsc_id_23-rsc_id_29"}, 

     {source:4, target:0, value:"rsc_id_17-rsc_id_36"}, 

     {source:0, target:2, value:"rsc_id_35-rsc_id_28"}, 

     {source:0, target:4, value:"rsc_id_36-rsc_id_17"}, 

     {source:2, target:3, value:"rsc_id_29-rsc_id_23"}, 

     {source:0, target:1, value:"rsc_id_34-rsc_id_42"}, 

     {source:2, target:0, value:"rsc_id_28-rsc_id_35"}, 

     {source:5, target:4, value:"br_eth2:39"} 


    ], 
} 


/* Useful functi ns*/ 

function get_node_info_formated(d){ 
    type = get_node_type(d); 
     if(type == "openflow") { 
      var nameString = "<b>Switch Datapath ID: "+d.nodeName+"</b><br><br>"; 
      if(d.nodeConnections.length>0){ 
       connectionsString = "<b>Connections:</b><br>"; 
       for (i=0;i<d.nodeConnections.length;i++){ 
        connectionsString = connectionsString + "<b>·Port "+d.nodeConnections[i]['src_port']+"</b> to Switch "+d.nodeConnections[i]['target_datapath']+" at Port "+d.nodeConnections[i]['target_port']+"<br>"; 
       } 
      } 
      else{ 
       connectionsString = ""; 
      } 
      return nameString+connectionsString ; 
     } else if(type == "planetlab") { 
      return nameString; 
     } else if(type == "vtserver") { 
      var nameString = "<b>Server: "+d.nodeName+"</b><br><br>";   
      if (d.nodeVms.length > 0){ 
       var vmListString = "<b>VMs ("+d.nodeVms.length+"):</b><br clear=left>"; 
       for (i=0;i<d.nodeVms.length;i++){ 
        vmListString = vmListString + d.nodeVms[i]; 
        if (i < d.nodeVms.length-1){ 
         vmListString = vmListString + ", "; 
        } 
        else{ 
         vmListString = vmListString +"<br clear = left><br clear=left>"; 
        } 
       } 
      } 
      else{ 
       vmListString = "<b>No VMs in this Server </b></br><br clear=left>" 
      } 
      var vmInterfacesString = "<b>VMs Interfaces:</b><br clear=left>" 
      for (i=0;i<d.nodeVmInterfaces.length;i++){ 
       vmInterfacesString = vmInterfacesString + "· "+"<b>"+d.nodeVmInterfaces[i]['name']+"</b> to Switch: "+d.nodeVmInterfaces[i]['switch']+ " at port: "+d.nodeVmInterfaces[i]['port']+"<br clear=left>"; 
      } 
      return nameString + vmListString+vmInterfacesString; 
     } 


} 

function get_node_type(d) { 
    var of_groups_len = 1; 
    var pl_groups_len = 0; 
    var vt_aggs_len = 1; 
    if(d.group < of_groups_len) { 
     return "openflow"; 
    } else if(d.group < of_groups_len + pl_groups_len) { 
     return "planetlab"; 
    } else if (d.group <(of_groups_len + pl_groups_len+vt_aggs_len)){ 
    return "vtserver" 
    }else{ 
     return "unknown"; 
    } 
} 
/* On Click event functions */ 
function clickSwitchOrLink(d){ 
    /* if all are selected then unselect all */ 
     selected_len = $(":checkbox:checked.node_id_"+d.nodeValue).length 
     all_len = $(":checkbox:.node_id_"+d.nodeValue).length 
     if(selected_len == all_len) { 
      $(":checkbox:checked.node_id_"+d.nodeValue).click(); 
     } 
     /* else, select all */ 
     else { 
      $(":checkbox:not(:checked).node_id_"+d.nodeValue).click(); 
     } 
} 

function clickServer(d){ 

} 


/* Zooming routines */ 

cur_zoom = 1; 

function zoomIn(zoom) { 
     cur_zoom = cur_zoom + zoom; 
    vis.transform(pv.Transform.identity.scale(cur_zoom).translate((Math.round(w/ 
cur_zoom) - w)/2, (Math.round(h/cur_zoom) - h)/2)); 
     vis.render(); 
     return false; 
} 

function zoomOut(zoom) { 
    if(cur_zoom-zoom >0) 
      cur_zoom = cur_zoom - zoom; 
    else 
     return false; 
    vis.transform(pv.Transform.identity.scale(cur_zoom).translate((Math.round(w/ 
cur_zoom) - w)/2, (Math.round(h/cur_zoom) - h)/2)); 
     vis.render(); 
     return false; 
} 

function zoomReset() { 
    // value is 0.99 due to Firefox bug when it is 1 
    cur_zoom=0.99; 
    vis.transform(pv.Transform.identity.scale(cur_zoom).translate((Math.round(w/ 
cur_zoom) - w)/2, (Math.round(h/cur_zoom) - h)/2)); 
    vis.render(); 
    return false; 
} 


/* Instansiation General parameters*/ 
var w = 740, 
    h = 400, 
    colors = pv.Colors.category20(); 

var vis; 
vis = new pv.Panel().canvas('target') 
    .width(w) 
    .height(h) 
    .fillStyle("white") 

var force = vis.add(pv.Layout.Force) 
    .bound(true) 
    .nodes(data.nodes) 
    .links(data.links) 
    .iterations(90); 

force.springLength(100); 
force.chargeConstant(0.1); 
force.chargeTheta(0.9); 

force.link.add(pv.Line) 
    .strokeStyle(function(d, p) { 
     /* if any resources on the link are selected */ 
     rsc_ids = p.value.split("-"); 
     if($(":checkbox#"+rsc_ids[0]+":checked").length) { 
      return "#990000"; 
     } 
     if($(":checkbox#"+rsc_ids[1]+":checked").length) { 
      return "#990000"; 
     } 
     return "black"; 
    }); 

//force.label.add(pv.Label); 
    //.top(); 

/* 
force.node.add(pv.Dot) 
    .size(function(d) (50)) 
    .fillStyle(function(d) d.fix ? "brown" : colors(d.group)) 
    .strokeStyle(function() this.fillStyle().darker()) 
    .lineWidth(1) 
    .title(function(d) d.nodeName) 
    .event("mousedown", pv.Behavior.drag()) 
    .event("drag", force); 
*/ 

//$("#selected_node_info").hide() 

force.node.add(pv.Image) 
    .url(function (d) { 
     type = get_node_type(d); 
     if(type == "openflow") { 
      return "/static/media/img/switch-tiny.png"; 
     } else if(type == "planetlab") { 
      return "/static/media/img/host-tiny.png"; 
     } else if(type == "vtserver") { 
      return "/static/media/img/server-tiny.png"; 
     } else { 
      return "/static/media/img/inactive.png"; 
     } 
    }) 
    .def("i", -1) 
    .width(20) 
    .height(20) 
    .fillStyle(function (d) { 
    if (this.i() == this.index) 
     return "brown"; 
     type = get_node_type(d); 
     if(type == "openflow") { 
      return "#999999"; 
     } else if(type == "planetlab") { 
      return "#333333"; 
     } else if(type == "vtserver") { 
      return "#006699"; 
     } else { 
      return "#CCCCCC"; 
     } 
    }/*function(d) { 
     if (this.i() == this.index) { 
      return "brown"; 
     } 
    if(get_node_type(d)=="openflow") 
      return "#999999"; 
    else 
     return "#CCCCCC"; 
    }*/) 
    .strokeStyle(function(d) { 
     /* if any ports are selected */ 
     if($(":checkbox:checked.node_id_"+d.nodeValue).length) { 
      return "#990000"; 
     } 
     return this.fillStyle().darker(); 
    }) 
    .cursor("pointer") 
// .title(function(d) d.nodeName) 
    .event("mousedown", pv.Behavior.drag()) 
    .event("mouseover", function(d) { 
//  pv.Behavior.tipsy({ gravity: "w", fade: true }) 
     /* display info on the selected node in the div */ 
     type = get_node_type(d); 
     desc = "Unknown" 
     if(type == "openflow") { 
      desc = "OpenFlow switch"; 
     } else if(type == "planetlab") { 
      desc = "PlanetLab node"; 
     } else if(type == "vtserver") { 
      desc = "Virtualized server"; 
     } 
     tooltip.show(get_node_info_formated(d)); 

     $("#selected_node_info").html("Selected " + desc + ": " + d.nodeName); 
     $("#selected_node_info").show(); 
     /* store the info about the selected node and highlight it */ 
     this.i(this.index); 
    }) 
    .event("click", function(d) { 
     type = get_node_type(d); 
     if(type == "openflow") { 
     clickSwitchOrLink(d); 
     } else if(type == "planetlab") { 
      return; 
     } else if(type == "vtserver") { 
      clickServer(d); 
     } 
    }) 
    .event("mouseout", function() this.i(-1)) 
    .event("mouseout", function() { 
      tooltip.hide(); 
     }) 
    .event("drag", force) 
    //.anchor("bottom").add(pv.Label).text(function(d) d.nodeName); 

vis.render(); 

</script> 

<div style="border:1px solid #CCCCCC;padding:0px;overflow:hidden;margin-bottom:20px;"> 
<div id="selected_node_info" style="height:14px;background-color:#DDDDDD;">Tip: Move cursor over the icons to get extra information...</div> 

<div id="target"> 
</div> 
<div style="width:100%;text-align:right;padding-top:2px;margin-top:2px;background-color: #333333"> 

    <a href="#" onClick="return zoomIn(0.25)"/><img src="/static/media/img/zoomin.png" style="height:16px;text-align:middle"/></a>&nbsp; 
    <a href="#" onClick="return zoomOut(0.5)"/><img src="/static/media/img/zoomout.png" style="height:16px;"/></a>&nbsp; 
    <a href="#" onClick="return zoomReset()"/><img src="/static/media/img/zoom.png" style="height:16px;"/></a>&nbsp; 
</div> 
</div> 
+0

是額外的關閉腳本標記原始文件有錯誤嗎? – scunliffe 2012-07-30 02:48:55

+0

您應該發佈導致錯誤的唯一代碼。如何追蹤這麼長的代碼? – Lion 2012-07-30 02:49:27

+0

如果您無法弄清楚它的含義,請逐字發送完整的錯誤消息。 – bdares 2012-07-30 02:50:03

回答

0

腳本類型文本/ JavaScript的+ protovis」不是有效的MIME類型。它會導致IE 8(和其他瀏覽器我懷疑)完全忽略相關的腳本塊的內容,因此,誤差必須無論從topology.js或東西在試圖訪問的忽略腳本聲明或初始化標識的頁面別人來了。在IE

錯誤消息伴隨的行號。請告知那是什麼,它是從腳本或HTML文件中標識出它在適當的位置評論中引用的位置。

+0

你確定嗎? TypeError異常聽起來不像這種錯誤。儘管在提供的示例中執行JavaScript是值得懷疑的,但錯誤並不匹配。 – 2012-07-30 03:12:59

+0

非常感謝:) 只有在我的顧問辦公室的電腦上試用網頁時,纔會顯示錯誤消息。其他電腦(IE,Crome,...)都很好。 我的顧問返回假期後,我會發布詳細的錯誤。 – jaeyong 2012-07-30 03:41:29

相關問題