//定义全局map变量
var map;
var fmapID = '10347';
//定义按钮型楼层切换控件
var btnFloorControl;
//定义滚动型楼层切换控件
var scrollFloorControl;

window.onload=function(){
    map = new fengmap.FMMap({
        container : document.getElementById('fengMap'),     //渲染dom
        mapServerURL:'./data/' + fmapID,      //地图数据位置
        mapThemeURL : './data/theme',        //主题数据位置
        defaultThemeName: '2001',       //设置主题
        appName:'蜂鸟研发SDK_2_0',           //开发者申请应用名称
        key:'57c7f309aca507497d028a9c00207cf8',  //开发者申请应用下web服务的key
        focusAlphaMode: true,   //开启非聚焦层的透明显示模式
        focusAlpha:0.3          //非聚焦层的透明度，当focusAlphaMode = true时有效
    });

    //打开地图数据
    map.openMapById(fmapID);

    //地图加载完回调事件
    map.on('loadComplete', function() {
        //加载按钮型楼层切换控件
        loadBtnFloorCtrl();

        //加载滚动型楼层切换控件
        //loadScrollFloorCtrl();
    });

    //聚焦楼层改变事件
    map.on('focusGroupIDChanged', function (event) {
        console.log('地图聚焦楼层改变！', map.focusGroupID);
    });
};

//加载按钮型楼层切换控件
function loadBtnFloorCtrl() {
    //楼层控制控件配置参数
    var btnFloorCtlOpt = new fengmap.controlOptions({
        //默认在右下角
        position: fengmap.controlPositon.RIGHT_TOP,
        //初始楼层按钮显示个数配置。默认显示5层,其他的隐藏，可滚动查看
        showBtnCount: 6,
        //初始是否是多层显示，默认单层显示
        allLayer: false,
        //位置x,y的偏移量
        offset: {
            x: -20,
            y: 20
        }
    });
    //不带单/双层楼层控制按钮,初始时只有1个按钮,点击后可弹出其他楼层按钮
    btnFloorControl = new fengmap.buttonGroupsControl(map, btnFloorCtlOpt);
    //楼层切换
    btnFloorControl.onChange(function (groups, allLayer) {
        //groups 表示当前要切换的楼层ID数组,
        //allLayer表示当前楼层是单层状态还是多层状态。
        console.log('当前切换楼层：' + groups);
    });
    //切换楼层,changeFocusGroup(目标层groupID,是否多层状态)
    //btnFloorControl.changeFocusGroup(2, true);
    //默认是否展开楼层列表，true为展开，false为不展开
    btnFloorControl.expand = true;
    //楼层控件是否可点击，默认为true
    btnFloorControl.enableExpand = true;
}

//加载滚动行楼层切换控件
function loadScrollFloorCtrl() {
    var scrollFloorCtlOpt = new fengmap.controlOptions({
        //默认在右上角
        position: fengmap.controlPositon.RIGHT_TOP,
        //默认显示楼层的个数
        showBtnCount: 6,
        //初始是否是多层显示，默认单层显示false
        allLayer: false,
        //是否显示多层/单层切换按钮
        needAllLayerBtn: true,
        //位置x,y的偏移量
        offset: {
            x: -20,
            y: 20
        }
    });
    scrollFloorControl = new fengmap.scrollGroupsControl(map, scrollFloorCtlOpt);
    //楼层切换
    scrollFloorControl.onChange(function (groups, allLayer) {
        //groups 表示当前要切换的楼层ID数组,
        //allLayer表示当前楼层是单层状态还是多层状态。
        console.log(groups);
    });
    //切换楼层方法,changeFocusGroup(目标层groupID)
    //scrollFloorControl.changeFocusGroup(2);
    //切换单、多层方法，changeGroupsSelect(ture表示多层/false表示单层)
    //scrollFloorControl.changeGroupsSelect(true);
}

//定义全局map变量
var fmapID = '10347'; //mapId
var map = new fengmap.FMMap({
    container: document.getElementById('fengMap'), //渲染dom
    mapServerURL: './data/' + fmapID,  //地图数据位置
    mapThemeURL: './data/theme',  //主题数据位置
    defaultThemeName: '2001',
    appName:'蜂鸟研发SDK_2_0',           //开发者申请应用名称
    key:'57c7f309aca507497d028a9c00207cf8',  //开发者申请应用下web服务的key
});

//打开Fengmap服务器上的地图数据和主题
map.openMapById(fmapID);

//地图加载完成回掉方法
map.on('loadComplete', function () {
    addImageMarker();  //添加图片标注imageMarker
    addTextMarker();   //添加文字标注textMarker
    addLineMarker();   //添加线标注lineMarker
    drawPolygon();  //绘制多边形
});

//1.添加图片标注ImageMarker
function addImageMarker() {
    var groupLayer = map.getFMGroup(map.focusGroupID);  //获取当前楼层

    //实例化方法1：自定义图片标注层
    //var layer = new fengmap.FMImageMarkerLayer();
    //添加图片标注层到模型层。否则地图上不会显示
    //groupLayer.addLayer(layer);

    //实例化方法2：
    //返回当前层中第一个imageMarkerLayer,如果没有，则自动创建
    var layer = groupLayer.getOrCreateLayer('imageMarker');

    //图标标注对象，默认位置为该楼层中心点
    var gpos = groupLayer.mapCoord;
    var im = new fengmap.FMImageMarker({
        //标注x坐标点
        x: gpos.x,
        //标注y坐标点
        y: gpos.y,
        //设置图片路径
        url: 'images/blueImageMarker.png',
        //设置图片显示尺寸
        size: 32,
        //标注高度，大于model的高度
        height: 4,
        callback: function () {
            // 在图片载入完成后，设置 "一直可见"，不被其他层遮挡
            im.alwaysShow();
        }
    });
    layer.addMarker(im);

    groupLayer.addLayer(layer);    //添加图片标注层到模型层。否则地图上不会显示

};
//2.添加文本标注
function addTextMarker() {
    var groupLayer = map.getFMGroup(map.focusGroupID);  //获取当前楼层
    //返回当前层中第一个textMarkerLayer,如果没有，则自动创建
    var layer = groupLayer.getOrCreateLayer('textMarker');

    //文字标注对象，默认位置为该楼层中心点
    var gpos = groupLayer.mapCoord;
    var tm = new fengmap.FMTextMarker({
        //标注x坐标点
        x: gpos.x,
        //标注y坐标点
        y: gpos.y,
        //标注值
        name: "这是一个文字标注",
        //文本标注填充色
        fillcolor: "255,0,0",
        //文本标注字体大小
        fontsize: 20,
        //文本标注边线颜色
        strokecolor: "255,255,0",
        //文本标注透明度
        alpha: 0.5,
        //textMarker加载完回调函数
        callback: function () {
            // 在marker载入完成后，设置 "一直可见"，不被其他层遮挡
            tm.alwaysShow();
        }
    });
    //文本标注层添加文本Marker
    layer.addMarker(tm);
}

//3.添加线标注
function addLineMarker() {
    //配置路径线的线型、线宽、透明度等参数
    var lineStyle1 = {
        //设置线的宽度
        lineWidth: 8,
        //设置线的透明度
        alpha: 0.9,
        url: "images/arrow.png",
        //是否开启平滑线功能
        smooth: true,
        //设置线的颜色，十六进制颜色值
        //godColor: '#FF0000',
        //设置边线的颜色,十六进制颜色值
        //godEdgeColor: '#FF0000',
        //设置线的类型为导航线
        lineType: fengmap.FMLineType.FMARROW,
        //设置线动画,false为动画
        noAnimate: true,
    };
    //当前的路线
    var naviLines = [];
    //线标注线数据
    var naviResults = [{
        groupId: 1,
        points: [{x: 12961602.00,y: 4861851.50,z: 1},
                {x: 12961625.00,y: 4861850.50,z: 1},
                {x: 12961625.00,y: 4861825.00,z: 1}]
    }];
    //创建路径线图层
    var line = new fengmap.FMLineMarker();
    //循环naviResults中坐标点集合，通过坐标点绘制路径线
    for (var i = 0; i < naviResults.length; i++) {
        var result = naviResults[i];
        var gid = result.groupId;
        var points = result.points;
        //创建FMSegment点集，一个点集代表一条折线
        var seg = new fengmap.FMSegment();
        seg.groupId = gid;
        seg.points = points;
        //将FMSegment绘制到线图层上
        line.addSegment(seg);
        //绘制线
        var lineObject = map.drawLineMark(line, lineStyle);
        naviLines.push(line);
    }
}
//矩形标注
var rectangleMarker;
//圆形标注
var circleMaker;
//自定义形状标注
var polygonMarker;
//4.绘制多边形
function drawPolygon() {
    var groupLayer = map.getFMGroup(map.focusGroupID);  //获取当前楼层
    //返回当前层中第一个polygonMarker,如果没有，则自动创建
    var layer = groupLayer.getOrCreateLayer('polygonMarker');

    //创建矩形标注
    createRectangleMaker();
    layer.addMarker(rectangleMarker);

    //创建圆形标注
    createCircleMaker();
    layer.addMarker(circleMaker);

    //创建自定义形状标注
    createPolygonMaker(coords);
    layer.addMarker(polygonMarker);
}
//创建矩形标注
function createRectangleMaker() {
    rectangleMarker = new fengmap.FMPolygonMarker({
        //设置颜色
        color: '#9F35FF',
        //设置透明度
        alpha: .3,
        //设置边框线的宽度
        lineWidth: 1,
        //设置高度
        height: 8,
        //多边形的坐标点集数组
        points: {
            //设置为矩形
            type: 'rectangle',
            //设置此形状的中心坐标
            center: {
                x: 1.2961583E7,
                y: 4861865.0
            },
            /*startPoint: {
                x: 1.2961583E7,
                y: 4861865.0
            },*/
            //设置矩形的宽度
            width: 30,
            //设置矩形的高度
            height: 30
        }
    });
}
//创建圆形标注
function createCircleMaker() {
    circleMaker = new fengmap.FMPolygonMarker({
        //设置颜色
        color: '#3CF9DF',
        //设置透明度
        alpha: .3,
        //设置边框线的宽度
        lineWidth: 3,
        //设置高度
        height: 7,
        //多边形的坐标点集数组
        points: {
            //设置为圆形
            type: 'circle',
            //设置此形状的中心坐标
            center: {
                x: 1.2961644E7,
                y: 4861874.0
            },
            //设置半径
            radius: 30,
            //设置段数，默认为40段
            segments: 40
        }
    });
}
//创建自定义形状标注
function createPolygonMaker(coords) {
    //实例化polygonMarker
    polygonMarker = new fengmap.FMPolygonMarker({
        //设置透明度
        alpha: .5,
        //设置边框线的宽度
        lineWidth: 1,
        //设置高度
        height: 6,
        //多边形的坐标点集数组
        points: [{x: 12961583,y: 4861865,z: 56},
                {x: 12961644,y: 4861874,z: 56},
                {x: 12961680,y: 4861854,z: 56},
                {x: 12961637,y: 4861819,z: 56},
                {x: 12961590,y: 4861835,z: 56}]
    });
}

//定义全局map变量
var fmapID = '10347'; //mapId
var map = new fengmap.FMMap({
    container: document.getElementById('fengMap'), //渲染dom
    mapServerURL: './data/' + fmapID,  //地图数据位置
    mapThemeURL: './data/theme',  //主题数据位置
    defaultThemeName: '2001',    //设置主题
    appName:'蜂鸟研发SDK_2_0',           //开发者申请应用名称
    key:'57c7f309aca507497d028a9c00207cf8',  //开发者申请应用下web服务的key
});

//打开fengMap服务器上的地图数据和主题
map.openMapById(fmapID);

//地图加载完成回调方法，执行测试搜索分析。
map.on('loadComplete', function () {
    //创建FMSearchAnalyser
    var searchAnalyser = new fengmap.FMSearchAnalyser(map, map.getCurrDecodeData());
    //创建FMSearchRequest
    var searchRequest = new fengmap.FMSearchRequest();
    //设置搜索参数
    searchRequest.keyword = "测试关键字";
    //搜索分析
    searchAnalyser.query(searchRequest, function (result) {
        //搜索结果
        console.log(result);
    });
});

//定义全局map变量
var fmapID = '10347'; //mapId

//定义路径规划对象
var naviAnalyser = null;
//起终点坐标
var coords = [{x:12961699.79823795,y:4861826.46384646,groupID:6},{x:12961587.6306147,y:4861844.85608228,groupID:5}];

//初始化地图对象
var map = new fengmap.FMMap({
    container: document.getElementById('fengMap'), //渲染dom
    mapServerURL: './data/' + fmapID, //地图数据位置
    mapThemeURL: './data/theme',  //主题数据位置
    defaultThemeName: '2001',  //设置主题
    appName:'蜂鸟研发SDK_2_0',           //开发者申请应用名称
    key:'57c7f309aca507497d028a9c00207cf8',  //开发者申请应用下web服务的key
});

//打开fengMap服务器上的地图数据和主题
map.openMapById(fmapID);

//地图加载完成回掉方法
map.on('loadComplete', function () {
    //初始化路径分析对象
    naviAnalyser = new fengmap.FMNaviAnalyser();
    naviAnalyser.init(map);
    drawNaviLine();
});
//画导航线
function drawNaviLine() {
    addMarker(coords[0], 'start');
    addMarker(coords[1], 'end');

    //根据已加载的fengmap.FMMap导航分析，判断路径规划是否成功
    var analyzeNaviResult = naviAnalyser.analyzeNavi(coords[0].groupID, coords[0], coords[1].groupID, coords[1], fengmap.FMNaviMode.MODULE_SHORTEST);
    if (fengmap.FMRouteCalcuResult.ROUTE_SUCCESS != analyzeNaviResult) {
        return;
    }
    //获取路径分析结果对象，所有路线集合
    var results = naviAnalyser.getNaviResults();
    //初始化线图层
    var line = new fengmap.FMLineMarker();
    for (var i = 0; i < results.length; i++) {
        var result = results[i];
        //楼层id
        var gid = result.groupId;
        //路径线点集合
        var points = result.getPointList();

        var points3d = [];
        points.forEach(function (point) {
            points3d.push({
                //x坐标点
                'x': point.x,
                //y坐标点
                'y': point.y,
                //线标注高度
                'z': 1
            });
        });
        //fengmap.FMSegment点集，一个点集代表一条折线
        var seg = new fengmap.FMSegment();
        seg.groupId = gid;
        seg.points = points3d;
        line.addSegment(seg);
    }
    //绘制线
    //配置线型、线宽、透明度等
    var lineStyle = {
        //设置线的宽度
        lineWidth: 6,
        //设置线的透明度
        alpha: 0.8,
        //设置线的类型为导航线
        lineType: fengmap.FMLineType.FMARROW,
        //设置线动画,false为动画
        noAnimate: false
    };
    map.drawLineMark(line, lineStyle);
}
//添加起点终点marker
function addMarker(coord, type) {
    //获取目标点层
    var group = map.getFMGroup(coord.groupID);
    //创建marker，返回当前层中第一个imageMarkerLayer,如果没有，则自动创建
    var layer = group.getOrCreateLayer('imageMarker');
    var markerUrl = '';
    if (type === 'start') {
        markerUrl = 'images/start.png';
    } else {
        markerUrl = 'images/end.png';
    }
    //图标标注对象，默认位置为该楼层中心点
    var im = new fengmap.FMImageMarker({
        x: coord.x,
        y: coord.y,
        //设置图片路径
        url: markerUrl,
        //设置图片显示尺寸
        size: 32,
        //marker标注高度
        height: 2,
        callback: function () {
            //设置 "一直可见",不参与避让
            //im.alwaysShow();
        }
    });
    //添加imageMarker
    layer.addMarker(im);
}