Skip to content
On this page

MiniMap Node

The minimap node component can be used to extend the default minimap nodes. You can use it to add an icon to your node, or to add a custom tooltip etc.

Usage

To use the component pass the MiniMapNode as a child to the MiniMap component.

vue
<template>
  <VueFlow>
    <MiniMap>
      <template #node-input="props">
        <MiniMapNode v-bind="props" />
      </template>
    </MiniMap>
  </VueFlow>
</template>

Props

NameDefinitionTypeOptionalDefault
idNode idstringfalse-
parentNodeParent node idstringtrue-
selectedIs node selectedbooleantruefalse
draggingIs node draggingbooleantruefalse
positionXY position of nodeXYPositionfalse-
dimensionsNode dimensionsDimensionsfalse-
borderRadiusMiniMap node css border-radiusnumbertrue-
colorMiniMap node css colorstringtrue-
shapeRenderingMiniMap node css shapeRenderingShapeRenderingtrue-
strokeColorMiniMap node css stroke-colorstringtrue-
strokeWidthMiniMap node css stroke-widthstringtrue-

Slots

NameDefinition
defaultSlot below MiniMap node rect

Released under the MIT License.