Reimplementing GoJS context menu in HTML

GoJS
1

Hi previously am using gojs Context Menu Button now i need to converted this code into Html context menu using gojs…

Please help me how to do it…

var nodeMenu = // context menu for each Node

  $(go.Adornment, "Vertical",
   $("ContextMenuButton",
     $(go.TextBlock, {margin:5,width:150,height:20,text:"Connection",textAlign:"left"}),
     { click:function(e,obj){ RightClick(obj) }}),
    $("ContextMenuButton",
      $(go.TextBlock, {margin:5,width:150,height:20,text:"Tag Mapping",textAlign:"left"}),
      { click: function(e,obj){ TagmappingMenu(obj) } })
     
  );

 
   var nodeConfigMenu =  // context menu for each Node
   $(go.Adornment, "Vertical",
  
    $("ContextMenuButton",
      $(go.TextBlock, {margin:5,width:150,height:20,text:"Tag Mapping",textAlign:"left"}),
      { click:function(e,obj){ TagmappingMenu(obj) }}),
    $("ContextMenuButton",{background: "white"},
      $(go.TextBlock, {margin:5,width:150,height:20,text:"Config",textAlign:"left"}),
      { click:function(e,obj){ Config(obj) } })
     
  );

  var nodeDirectorMenu =  // context menu for each Node
   $(go.Adornment, "Vertical",
    $("ContextMenuButton",
     $(go.TextBlock, {margin:5,width:150,height:20,text:"Connection",textAlign:"left"}),
     { click:function(e,obj){ RightClick(obj) }}),
    $("ContextMenuButton",
      $(go.TextBlock, {margin:5,width:150,height:20,text:"Tag Mapping",textAlign:"left"}),
      { click:function(e,obj){ TagmappingMenu(obj) }}),
    $("ContextMenuButton",{background: "white"},
      $(go.TextBlock, {margin:5,width:150,height:20,text:"Config",textAlign:"left"}),
      { click:function(e,obj){ Config(obj) } })
     
  );
2

Have you read GoJS Context Menus -- Northwoods Software ?
The next-to-last section refers to the Custom HTML Context Menu sample.

3

Hi previously am using gojs Context Menu Button now i need to converted this code into Html context menu using gojs…

Please help me how to do it…

var nodeMenu = // context menu for each Node
$(go.Adornment, “Vertical”,
$(“ContextMenuButton”,
$(go.TextBlock, {margin:5,width:150,height:20,text:“Connection”,textAlign:“left”}),
{ click:function(e,obj){ RightClick(obj) }}),
$(“ContextMenuButton”,
$(go.TextBlock, {margin:5,width:150,height:20,text:“Tag Mapping”,textAlign:“left”}),
{ click: function(e,obj){ TagmappingMenu(obj) } })

);

var nodeConfigMenu = // context menu for each Node
$(go.Adornment, “Vertical”,

$("ContextMenuButton",
  $(go.TextBlock, {margin:5,width:150,height:20,text:"Tag Mapping",textAlign:"left"}),
  { click:function(e,obj){ TagmappingMenu(obj) }}),
$("ContextMenuButton",{background: "white"},
  $(go.TextBlock, {margin:5,width:150,height:20,text:"Config",textAlign:"left"}),
  { click:function(e,obj){ Config(obj) } })

);

var nodeDirectorMenu = // context menu for each Node
$(go.Adornment, “Vertical”,
$(“ContextMenuButton”,
$(go.TextBlock, {margin:5,width:150,height:20,text:“Connection”,textAlign:“left”}),
{ click:function(e,obj){ RightClick(obj) }}),
$(“ContextMenuButton”,
$(go.TextBlock, {margin:5,width:150,height:20,text:“Tag Mapping”,textAlign:“left”}),
{ click:function(e,obj){ TagmappingMenu(obj) }}),
$(“ContextMenuButton”,{background: “white”},
$(go.TextBlock, {margin:5,width:150,height:20,text:“Config”,textAlign:“left”}),
{ click:function(e,obj){ Config(obj) } })

);

4

Hi,
I saw those two Urls but i didn’t understand am new from gojs…please help me

5

I suggest that you adapt the code from the sample. It’s all just JavaScript, HTML, and CSS.