Quantcast
Channel: GoJS - Northwoods Software
Viewing all articles
Browse latest Browse all 7069

Can't fire click event in tooltip

$
0
0

@CL.Peter wrote:

Hi all,
I want to add click event inside tooltip, like this sample, I can click the tip panel to do something:

var myDiagram;
  function init() {
if (window.goSamples) goSamples();  // init for these samples -- you don't need to call this
var $ = go.GraphObject.make;  // for conciseness in defining templates
myDiagram =
  $(go.Diagram, "myDiagramDiv", // must be the ID or reference to div
    {
        initialContentAlignment: go.Spot.Center,
        "undoManager.isEnabled": true,      //can redo/undo
        "animationManager.isEnabled": false,//NOT ALLOW animation
        hasHorizontalScrollbar: false,      //cancel scrollbar
        hasVerticalScrollbar: false,        //cancel scrollbar
        allowCopy: false                    //NOT ALLOW COPY
    });

function clickOnToolTip() {
    window.alert("Click on the tip");
}

// define the Node template
myDiagram.nodeTemplate =
  $(go.Node, "Auto",
    // define the node's outer shape
    $(go.Shape, "Rectangle",
      {
        name: "SHAPE", fill: "black", stroke: null
        }),
    {
        toolTip:  
        $(go.Adornment, "Auto",
            $(go.Shape, { fill: "#FFFFCC", width: 50, height: 50 },
                {
                    click: clickOnToolTip
                }
            ),
            $(go.TextBlock, { margin: 4 },
                new go.Binding("text", "key"))
        )
    }

    );  // end Node

// define the Link template
myDiagram.linkTemplate =
  $(go.Link, go.Link.Orthogonal,
    { corner: 5},
    $(go.Shape, { strokeWidth: 4, stroke: "#00a4a4" }));  // the link shape

myDiagram.model = $(go.GraphLinksModel);
myDiagram.model.nodeDataArray = [
    { key: 1, group: 66 }, { key: 2, group: 66 }, { key: 66, isGroup: true,group:88 }, {key:88,isGroup:true}];
myDiagram.model.linkDataArray = [{ from: 1, to: 2 }];

myDiagram.groupTemplate = $(go.Group, "Auto",
    { // define the group's internal layout
        layout: go.GraphObject.make(go.TreeLayout,
            { arrangement: go.TreeLayout.ArrangementVertical, isRealtime: false, layerSpacing: 100 },
        ),
        // the group begins unexpanded;
        // upon expansion, a Diagram Listener will generate contents for the group
        isSubGraphExpanded: true
    },
    go.GraphObject.make(go.Shape, "Rectangle",
        { fill: null, stroke: "gray", strokeWidth: 2 }),
    go.GraphObject.make(go.Panel, "Vertical",
        { defaultAlignment: go.Spot.Left, margin: 30 },
        go.GraphObject.make(go.Panel, "Horizontal",
            { defaultAlignment: go.Spot.Top },
            // the SubGraphExpanderButton is a panel that functions as a button to expand or collapse the subGraph
            go.GraphObject.make("SubGraphExpanderButton"),
            go.GraphObject.make(go.TextBlock,
                { font: "Bold 18px Sans-Serif", margin: 4 }
        ),
        // create a placeholder to represent the area where the contents of the group are
        go.GraphObject.make(go.Placeholder,
            { padding: new go.Margin(10, 30) })
    )
    )); 

  }

However, the click in the tooltip never fired, please give me some help to do that.
Thanks.

Posts: 2

Participants: 2

Read full topic


Viewing all articles
Browse latest Browse all 7069

Trending Articles