https://github.com/mudin/indoorjs

Indoor mapping for floorplans using on fabricjs
https://github.com/mudin/indoorjs

fabric fabricjs grid grid-system indoor-maps map plot

Last synced: 11 months ago
JSON representation

Indoor mapping for floorplans using on fabricjs

• Host: GitHub
• URL: https://github.com/mudin/indoorjs
• Owner: mudin
• License: mit
• Created: 2019-05-01T07:04:23.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2020-08-13T09:00:08.000Z (almost 6 years ago)
• Last Synced: 2025-06-28T20:52:56.181Z (12 months ago)
• Topics: fabric, fabricjs, grid, grid-system, indoor-maps, map, plot
• Language: JavaScript
• Homepage: https://mudin.github.io/indoorjs
• Size: 1.94 MB
• Stars: 138
• Watchers: 7
• Forks: 39
• Open Issues: 3
• Metadata Files:
  • Readme: readme.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# IndoorJS 

[![unstable](http://badges.github.io/stability-badges/dist/unstable.svg)](http://github.com/badges/stability-badges)

![gzip-size](https://img.shields.io/badge/size-18.4kb-brightgreen.svg)



    

  

Indoor maps based on fabricjs with grid system, zooming, panning and anotations. 

See [demo](https://mudin.github.io/indoorjs).

![Markers and Connections demo](https://mudin.github.io/indoorjs/indoorjs.gif?raw=true)

## Usage

[![npm install indoorjs](https://nodei.co/npm/indoorjs.png?mini=true)](https://npmjs.org/package/indoorjs/)

```js

const mapEl = document.querySelector('.my-map');

let radar; let

  markers;

const map = new Indoor.Map(mapEl, {

  floorplan: new Indoor.Floor({

    url: './fp.jpeg',

    opacity: 0.4,

    width: 400,

    zIndex: 1

  }),

  minZoom: 0.001,

  maxZoom: 10,

  center: {

    x: 0,

    y: 0,

    zoom: 1

  }

});

```