Can KitchenSink app features be integrated into the MindMap app?

[QuangLanh]

Introduction

Currently, I want to integrate all the features of KitchenSink app into MindMap app so that I can use all the features of KitchenSink for MindMap UI as well. Is that possible?

Steps to reproduce

No response

Restrictions & Constraints

No response

Does your question relate to JointJS or JointJS+. Select both if applicable.

JointJS+

[kumilingus]

It is possible, but not every feature in the KitchenSink is applicable in a mind mapping application e.g snaplines, gridlines, send to back make no sense in the context of a mind map.

• You can add Stencil to your mind map application and integrate it with the TreeLayoutView (you don't want the elements to be added freely to the graph, but to be attached to the tree). Example to be found in the docs.
• Toolbar is already in there. So you just need to add your own tools / buttons.
• You can add the Inspector to edit the elements properties too.

[QuangLanh]

Currently, I have three questions I want to ask you:

First, why can't I display the images on the stencil part?

Second, although I can drag the image into the paper, I can't actually drop it into the paper.

Third, when I drag the elements on the paper, they don't move at all.

[kumilingus]

1. The Idea shape is a custom shape with custom view. The JSON of Idea shape looks more like this (there are no attrs):

  {
      type: 'Idea',
      label: 'My Label',
      annotations: [],
      image: '',
      imageSize: 50,
      spacing: 5,
      placeholder: ' ',
      outlineColor: 'black',
      fillColor: 'white',
      line: true            
  }

2. Here's an example how to integrate the Stencil plugin with TreeLayoutView: https://docs.jointjs.com/learn/features/drag-and-drop/tree-layout-view/

3. They do not move, because the example is using the ui.TreeLayouView plugin that is preventing them from doing so / and the paper is set to interactive: false.