自定义 Bing 地图类型问题
Custom Bing Map Type Issue
我在尝试更正此问题时遇到问题。我创建了 2 个自定义 Bing 地图类型。用户可以通过自定义下拉框更改地图类型。当用户从 Default 更改为 Road 时。大多数情况下,如果用户改回默认设置,道路会保持不变。我错过了这么明显的东西吗?我已经包含了我的代码。
地图类型
var defaultMapColors =
{
"version": "1.0",
"settings":
{
"landColor": "#686868"
},
"elements":
{
"mapElement": { "labelVisible": false },
"area": { "visible": false },
"transportation": { "visible": false },
"countryRegion": { //country
"borderStrokeColor": "#444444",
"borderOutlineColor": "#00000000",
"borderWidthScale": 3,
"fillColor": "#888888",
"visible": true
},
"adminDistrict": { //states
"borderVisible": true,
"borderStrokeColor": "#444444",
"borderOutlineColor": "#00000000",
"borderWidthScale": 3,
"fillColor": "#888888",
},
"water": { "fillColor": "#4E5E6D" },
"point": { "visible": false }
}
};
var defaultMapColorsWithRoads =
{
"version": "1.0",
"settings":
{
"landColor": "#686868"
},
"elements":
{
"mapElement": { "labelVisible": false },
"area": { "visible": false },
"transportation": {
"visible": true,
"strokeColor": "#ffffff",
},
"countryRegion": { //country
"borderStrokeColor": "#444444",
"borderOutlineColor": "#00000000",
"borderWidthScale": 3,
"fillColor": "#888888",
"visible": true
},
"adminDistrict": { //states
"borderVisible": true,
"borderStrokeColor": "#444444",
"borderOutlineColor": "#00000000",
"borderWidthScale": 3,
"fillColor": "#888888",
},
"water": { "fillColor": "#4E5E6D" },
"point": { "visible": false }
}
};
下拉
<div class="form-group">
<select id="customNavSelector" class="form-control selectpicker show-tick">
<option value="Default" onclick="map.setView({ mapTypeId: Microsoft.Maps.MapTypeId.road, customMapStyle: defaultMapColors });">Default</option>
<option value="Road" onclick="map.setView({ mapTypeId: Microsoft.Maps.MapTypeId.road, customMapStyle: defaultMapColorsWithRoads });">Road</option>
<option value="Aerial" onclick="map.setView({ mapTypeId: Microsoft.Maps.MapTypeId.aerial, customMapStyle: '' });">Aerial</option>
</select>
</div>
地图对象
map = new Microsoft.Maps.Map(mapDiv,
{
credentials: "@ViewBag.BingMapKey",
center: new Microsoft.Maps.Location(@ConfigurationManager.AppSettings["CenterLatitude"], @ConfigurationManager.AppSettings["CenterLongitude"]),
customMapStyle: defaultMapColors,
mapTypeId: Microsoft.Maps.MapTypeId.road, //grayscale, aerial, road, canvasLight, canvasDark
//liteMode: true,
showMapTypeSelector: false, //set to true to show default bing map selector
disableStreetside: false,
disableStreetsideAutoCoverage: true,
zoom: zoom,
backgroundColor: 'black',
//showBreadcrumb: true,
//showLocateMeButton: locator,
enableInertia: false,
enableClickableLogo: false,
navigationBarMode: Microsoft.Maps.NavigationBarMode.compact //compact, default, minified
});
存在一个已知问题,即设置地图样式会将新样式与旧样式合并,而不是将其完全覆盖。该团队计划解决此问题。同时,如果您处理当前地图并使用地图样式创建地图的新实例,它将按预期工作。
我在尝试更正此问题时遇到问题。我创建了 2 个自定义 Bing 地图类型。用户可以通过自定义下拉框更改地图类型。当用户从 Default 更改为 Road 时。大多数情况下,如果用户改回默认设置,道路会保持不变。我错过了这么明显的东西吗?我已经包含了我的代码。
地图类型
var defaultMapColors =
{
"version": "1.0",
"settings":
{
"landColor": "#686868"
},
"elements":
{
"mapElement": { "labelVisible": false },
"area": { "visible": false },
"transportation": { "visible": false },
"countryRegion": { //country
"borderStrokeColor": "#444444",
"borderOutlineColor": "#00000000",
"borderWidthScale": 3,
"fillColor": "#888888",
"visible": true
},
"adminDistrict": { //states
"borderVisible": true,
"borderStrokeColor": "#444444",
"borderOutlineColor": "#00000000",
"borderWidthScale": 3,
"fillColor": "#888888",
},
"water": { "fillColor": "#4E5E6D" },
"point": { "visible": false }
}
};
var defaultMapColorsWithRoads =
{
"version": "1.0",
"settings":
{
"landColor": "#686868"
},
"elements":
{
"mapElement": { "labelVisible": false },
"area": { "visible": false },
"transportation": {
"visible": true,
"strokeColor": "#ffffff",
},
"countryRegion": { //country
"borderStrokeColor": "#444444",
"borderOutlineColor": "#00000000",
"borderWidthScale": 3,
"fillColor": "#888888",
"visible": true
},
"adminDistrict": { //states
"borderVisible": true,
"borderStrokeColor": "#444444",
"borderOutlineColor": "#00000000",
"borderWidthScale": 3,
"fillColor": "#888888",
},
"water": { "fillColor": "#4E5E6D" },
"point": { "visible": false }
}
};
下拉
<div class="form-group">
<select id="customNavSelector" class="form-control selectpicker show-tick">
<option value="Default" onclick="map.setView({ mapTypeId: Microsoft.Maps.MapTypeId.road, customMapStyle: defaultMapColors });">Default</option>
<option value="Road" onclick="map.setView({ mapTypeId: Microsoft.Maps.MapTypeId.road, customMapStyle: defaultMapColorsWithRoads });">Road</option>
<option value="Aerial" onclick="map.setView({ mapTypeId: Microsoft.Maps.MapTypeId.aerial, customMapStyle: '' });">Aerial</option>
</select>
</div>
地图对象
map = new Microsoft.Maps.Map(mapDiv,
{
credentials: "@ViewBag.BingMapKey",
center: new Microsoft.Maps.Location(@ConfigurationManager.AppSettings["CenterLatitude"], @ConfigurationManager.AppSettings["CenterLongitude"]),
customMapStyle: defaultMapColors,
mapTypeId: Microsoft.Maps.MapTypeId.road, //grayscale, aerial, road, canvasLight, canvasDark
//liteMode: true,
showMapTypeSelector: false, //set to true to show default bing map selector
disableStreetside: false,
disableStreetsideAutoCoverage: true,
zoom: zoom,
backgroundColor: 'black',
//showBreadcrumb: true,
//showLocateMeButton: locator,
enableInertia: false,
enableClickableLogo: false,
navigationBarMode: Microsoft.Maps.NavigationBarMode.compact //compact, default, minified
});
存在一个已知问题,即设置地图样式会将新样式与旧样式合并,而不是将其完全覆盖。该团队计划解决此问题。同时,如果您处理当前地图并使用地图样式创建地图的新实例,它将按预期工作。