/* eslint-disable no-undef */
import $ from 'jquery';
import React from 'react';
import { customStyle } from './mapStyle';

export default function Map(props: any) {
    window.console.log(props);
    $.getScript(
        `//api.map.baidu.com/getscript?type=webgl&v=1.0&ak=1XjLLEhZhQNUzd93EjU5nOGQ`,
        () => {
            let mapCenter = [119.603701, 30.636529];

            // @ts-ignore
            let flztMap = new window.BMapGL.Map('modalMap', {
                style: { styleJson: customStyle },
            });
            // @ts-ignore
            let point = new window.BMapGL.Point(mapCenter[0], mapCenter[1]);
            flztMap.centerAndZoom(point, 15);
            // @ts-ignore
            flztMap.addOverlay(new window.BMapGL.Marker(point));
        },
    );
    return <div id="modalMap" style={{ width: '100%', height: '100%' }} />;
}
