Search code examples
javascriptflowchartgojs

Javascript - GoJS Flowchart

I´m using Flowchart from http://gojs.net/latest/samples/flowchart.html and it is working fine. The only problem with it is, that it doesnt display the toolbar symbols which are shown in the example. Have someone usedFlowchart` too and had the same problem?

var $ = go.GraphObject.make;

myPalette =
                    $(go.Palette, "myPaletteDiv",  // must name or refer to the DIV HTML element
                        {
                            "animationManager.duration": 800, // slightly longer than default (600ms) animation
                            nodeTemplateMap: myDiagram.nodeTemplateMap,  // share the templates used by myDiagram
                            model: new go.GraphLinksModel([  // specify the contents of the Palette
                                {category: "Start", text: "Start"},
                                {text: "Step"},
                                {text: "???", figure: "Diamond"},
                                {category: "End", text: "End"},
                                {category: "Comment", text: "Comment"}
                            ])
                        });

Problem

enter image description here

Solution

  • I think you are initializing the Palette before you have initialized the Diagram and its Diagram.nodeTemplateMap. This effectively means that the Palette is not using your custom templates, so the nodes in your Palette are using the default node template.

    If you look at the source code in the Flowchart sample you'll see this:

    // initialize the Palette that is on the left side of the page
myPalette =
  $(go.Palette, "myPaletteDiv",  // must name or refer to the DIV HTML element
    {
      "animationManager.duration": 800, // slightly longer than default (600ms) animation
      nodeTemplateMap: myDiagram.nodeTemplateMap,  // share the templates used by myDiagram