您现在的位置: 首页 > SDK开发 > 开发指南

一、三维场景特效配置和开发

三维场景初始化常用配置示例:三维场景特效主题E001配置说明

全屏特效特效引擎目前不支持IE浏览器，支持Edge,chrome,firefox,微信,手机等


esmap.ESEffectTool.init({
    effectThemeSrc: './data/effects',
    effectThemeId: 'E001',
    isSetRoomEffect: true,
    loadRoads: true,
    isShowSkybox: true,
    isShowWater: true,
    isSetModelEffect: true
    isOpenScreenEffect: true
    // 开启全屏特效后,特效画质设定：(高：high;中：medium;低：low), 默认自动根据设备性能设定画质高低
    // effectQuality: 'high' 
});

基本配置属性:

序号 属性名称 数据格式 默认值 是否必须
1 effectThemeSrc (特效主题配置文件地址) String null 是
2 effectThemeId (特效主题编号) String null 是
3 isSetRoomEffect (是否应用特效配置中的建筑特效样式) Boolean false 否
4 loadRoads (是否加载配置中的路网特效) Boolean false 否
5 isShowSkybox (是否使用天空盒) Boolean false 否
6 isShowWater (是否应用配置中的水面特效) Boolean false 否
7 isSetModelEffect (是否应用配置中的模型特效) Boolean false 否

高级配置属性:

序号 属性名称 数据格式 默认值 是否必须
1 roadsDataSrc (外部路网数据文件地址) String null 否
2 isShowGround (是否应用配置中的地板样式) Boolean false 否
3 isOpenScreenEffect (是否应用配置中的全屏特效样式) Boolean false 否
4 effectQuality (开启全屏特效后，是否设置特效画质等级) String null 否

二、三维场景特效标注的开发使用流程

第一步:新建一个特效标注图层（以下代码都要在三维场景特效初始化完成后调用。）


map.on('effectsInitComplete',function(){
    // 创建用于管理特效标注的层对象
    var layer = new esmap.ESEffectTool.EffectLayer('myEffectLayer', esmap.ESLayer.EFFECT_MARKER);
    // 添加该层至三维场景（默认1层）
    esmap.ESEffectTool.addLayerToMap(layer);
    // 添加该层至三维场景的指定楼层（室内三维场景）
    esmap.ESEffectTool.addLayerToMap(layer, fnum);
    // 若需要指定三维场景ID和楼层层（用于园区三维场景和城市三维场景）
    esmap.ESEffectTool.addLayerToMap(layer, bid, fnum);
})

第二步:创建一个特效圆圈标注实例


// 创建一个如下图示例的特效标注
var marker = new esmap.ESEffectTool.EffectMarker(esmap.ESMarkerType.CIRCLE_ROTATE, {
    x: 12629907.4, y: 2580180.5,
    height: 50,
    callback: function(){ // 创建成功后的回调
        // marker.visible = false; 标注的显隐控制
    }
});

第三步:添加特效标注至特效层


layer.addMarker(marker);              //将特效marker添加到图层

删除标注

您可以删除一整个特效标注图层: 

//从三维场景上直接删除特效图层
esmap.ESEffectTool.removeLayer(layer);
也可以从图片标注图层中删除图片标注： 

layer.remove(marker);   //删除某一个标注
layer.removeAll();  //删除所有标注

部分普通标注应用特效方法


// 创建线标注
var linemark = new esmap.ESLineMarker({...});
map.drawLineMark(linemark);
// 设置线标注发光
linemark.setBloomLight(0.7); // 默认最高亮度为1，可以向下调节亮度，范围为（0~1）

// ------- 

// 创建多边形标注
var polygon = new esmap.ESPolygonMarker({...});
// 设置多边形标注发光
polygon.setBloomLight(0.7); // 默认最高亮度为1，可以向下调节亮度，范围为（0~1）
// 设置多边形边缘发光
polygon.setOutline();
// 移除多边形边缘发光
polygon.removeOutline();

// ------- 

// 创建模型标注
var marker3d = new esmap.ES3DMarker({...});
// 设置模型边缘发光
marker3d.setOutline();
// 移除模型边缘发光
marker3d.removeOutline();