Examples | FloorsJS API | 2GIS Documentation
FloorsJS API
// Specifying the size of the widget in percent
DG.FloorsWidget.init({
    width: '100%',
    height: '100%',
    initData: {
        complexId: '141373143573143',
    },
});

// Opens the widget with a search for "clothing"
DG.FloorsWidget.init({
    width: '960px',
    height: '600px',
    initData: {
        complexId: '141373143573143',
        options: {
            initialSearchQuery: 'clothing',
        },
    },
});

// Opens the widget with the card of the "Dozen" dumpling place open
DG.FloorsWidget.init({
    width: '960px',
    height: '600px',
    initData: {
        complexId: '141373143573143',
        options: {
            initialFirm: '141265770712989',
        },
    },
});

// Opens the widget with the "Coffee shops" category open
DG.FloorsWidget.init({
    width: '960px',
    height: '600px',
    initData: {
        complexId: '141373143573143',
        options: {
            initialRubric: '162',
        },
    },
});

// Opens the Novosibirsk IKEA widget with a zoom of 18
DG.FloorsWidget.init({
    width: '960px',
    height: '600px',
    initData: {
        complexId: '141373143569821',
        options: {
            initialFirm: '141265769608851',
            initialZoom: 18,
        },
    },
});

// Opens the widget on the -1st floor
DG.FloorsWidget.init({
    width: '960px',
    height: '600px',
    initData: {
        complexId: '141373143573143',
        options: {
            initialFloor: '-1',
        },
    },
});

// Rotating the map is forbidden
DG.FloorsWidget.init({
    width: '960px',
    height: '600px',
    initData: {
        complexId: '141373143573143',
        options: {
            rotatable: false,
        },
    },
});

// Custom zoom limits
DG.FloorsWidget.init({
    width: '960px',
    height: '600px',
    initData: {
        complexId: '141373143573143',
        options: {
            minZoom: 16,
            maxZoom: 25,
        },
    },
});
const widget = DG.FloorsWidget.init({
    width: '960px',
    height: '600px',
    initData: {
        complexId: '141373143573143',
    },
});

// Opens a search for "food"
widget.search('Food');

// Opens the "Dozen" dumpling place card
widget.showFirm('141265770712989');

// Opens the "Coffee shops" category
widget.showRubric('162');

// Zoom in
widget.zoomIn();

// Switches the floor
widget.showFloor('-2');
const widget = DG.FloorsWidget.init({
    width: '960px',
    height: '600px',
    initData: {
        complexId: '141373143573143',
    },
});

// Init event
widget.on('init', (event) => {
    console.log(event.type); // 'init'
    console.log(event.floorList); // ['-2', '-1', '1', '2', '3', '4']
    console.log(event.firmList); // [{id: '12345', floor: 0, floorName: '-2'}, ...]
});

// Click event
widget.on('click', (event) => {
    console.log(event.type); // 'click'
    console.log(event.firmIds); // ['1234', '5678']
});

// Zoomend event
widget.on('zoomend', (event) => {
    console.log(event.type); // 'zoomend'
    console.log(event.state); // {floor: 2, zoom: 18, minZoom: 17.5, maxZoom: 21.6}
});

// Floorswitch event
widget.on('floorswitch', (event) => {
    console.log(event.type); // 'floorswitch'
    console.log(event.state); // {floor: 3, zoom: 18, minZoom: 17.5, maxZoom: 21.6}
});

// Adding an event handler and removing it
const handler = (event) => console.log(event);
widget.on('click', handler);
widget.off('click', handler);

// Full unsubscribe from the click event
widget.off('click');

// Unsubscribe from all events
widget.off();