@vue-flow/minimap

This is a minimap component for Vue Flow. It can be used to add a minimap to the canvas, which will show a smaller version of the canvas with your nodes. The minimap can also be used to pan and zoom the main canvas.
8,118,301 6,922
vue typescript vue3 flow diagram editor graph node link port slot composition-api vue-flow vueflow
Install
npm install @vue-flow/minimap
Latest Version:1.5.4
Vue:3
License:MIT
Last Updated:Jul 14, 2026
Links: GitHub  ·  npm
Maintainer: braks

Vue Flow: MiniMap Component

This is a minimap component for Vue Flow. It can be used to add a minimap to the canvas, which will show a smaller version of the canvas with your nodes. The minimap can also be used to pan and zoom the main canvas.

🛠 Setup

# install
$ yarn add @vue-flow/minimap

# or
$ npm i --save @vue-flow/minimap

🎮 Quickstart

<script setup>
import { VueFlow } from '@vue-flow/core'
import { MiniMap } from '@vue-flow/minimap'

// import default minimap styles
import '@vue-flow/minimap/dist/style.css'

import initialElements from './initial-elements'

// some nodes and edges
const elements = ref(initialElements)
</script>

<template>
  <VueFlow v-model="elements" fit-view-on-init class="vue-flow-basic-example">
    <MiniMap />
  </VueFlow>
</template>

Related Packages

@vue-flow/core
16,735,981 6,922
composition-api diagram editor flow graph link node port slot typescript +4
@vue-flow/background

This is a background component for Vue Flow. It can be used to create a backgrou...

12,886,433 6,922
composition-api diagram editor flow graph link node port slot typescript +4
@vue-flow/controls

This is a control component for Vue Flow. It can be used to control the canvas i...

9,862,020 6,922
composition-api diagram editor flow graph link node port slot typescript +4
@vue-flow/node-resizer

This is a resizer component for Vue Flow. It can be used to resize your nodes.

3,756,522 6,922
composition-api diagram editor flow graph link node port slot typescript +4
@vue-flow/pathfinding-edge

__Custom edge that avoids crossing nodes__

128,023 6,913
composition-api diagram editor flow graph link node port slot typescript +4

Version History

Version Released Vue License
1.5.4 ^3.3.0 MIT
1.5.3 ^3.3.0 MIT
1.5.2 ^3.3.0 MIT
1.5.1 ^3.3.0 MIT
1.5.0 ^3.3.0 MIT