examples/data/geo-seatmap-flight.js

/*
title: Flight Seatmap with SVG
category: map
titleCN: 航班选座（SVG）
*/

$.get(ROOT_PATH + '/data/asset/geo/flight-seats.svg', function (svg) {

    echarts.registerMap('flight-seats', { svg: svg });

    var takenSeatNames = ['26E', '26D', '26C', '25D', '23C', '21A', '20F'];

    option = {
        tooltip: {
        },
        geo: {
            map: 'flight-seats',
            roam: true,
            selectedMode: 'multiple',
            layoutCenter: ['50%', '50%'],
            layoutSize: '95%',
            tooltip: {
                show: true
            },
            itemStyle: {
                color: '#fff'
            },
            emphasis: {
                itemStyle: {
                    color: null,
                    borderColor: 'green',
                    borderWidth: 2
                },
                label: {
                    show: false
                }
            },
            select: {
                itemStyle: {
                    color: 'green'
                },
                label: {
                    show: false,
                    textBorderColor: '#fff',
                    textBorderWidth: 2
                }
            },
            regions: makeTakenRegions(takenSeatNames)
        }
    };

    function makeTakenRegions(takenSeatNames) {
        var regions = [];
        for (var i = 0; i < takenSeatNames.length; i++) {
            regions.push({
                name: takenSeatNames[i],
                silent: true,
                itemStyle: {
                    color: '#bf0e08'
                },
                emphasis: {
                    itemStyle: {
                        borderColor: '#aaa',
                        borderWidth: 1
                    }
                },
                select: {
                    itemStyle: {
                        color: '#bf0e08'
                    }
                }
            });
        }
        return regions;
    }

    myChart.setOption(option);

    // Get selected seats.
    myChart.on('geoselectchanged', function (params) {
        var selectedNames = params.allSelected[0].name.slice();

        // Remove taken seats.
        for (var i = selectedNames.length - 1; i >= 0; i--) {
            if (takenSeatNames.indexOf(selectedNames[i]) >= 0) {
                selectedNames.splice(i, 1);
            }
        }

        console.log('selected', selectedNames);
    });

});