本文主要是介绍html动态 %3coption%3e,动态改变SLD，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
以下来源于“演示”——DemoRequest——WMS_getMap_SLD_BODY_LiteralMode.url
以此URL为样本进行过滤操作。
http://localhost:8080/geoserver/wms?bbox=-130,24,-66,50&Format=image/png&request=GetMap&width=550&height=250&srs=EPSG:4326&SLD_BODY=topp:statesUserSelectionSTATE_NAMEIllinois#FF0000
测试：
OpenLayers TileCacheExamplevar sld,map,layer;
function init(){
sld= "topp:states UserSelection STATE_NAME Nebraska #FF0000 STATE_NAME 20 normal bold 0.5 0.5 #FFFFFF ";
map = new OpenLayers.Map('map');
layer= new OpenLayers.Layer.WMS("MY WMS",
"http://127.0.0.1:8080/geoserver/wms",{
layers: 'topp:states',
SLD_BODY:sld
});
map.addLayer(layer);
map.addControl(newOpenLayers.Control.LayerSwitcher());
var lonlat=newOpenLayers.LonLat(-100.63477, 39.28711);
map.setCenter(lonlat, 4);//指定地图中心与初始缩放级别
map.addControl(newOpenLayers.Control.MousePosition());
}
function commit(){
var Name;
var formElement =document.getElementsByName('sel')[0];
// console.log(formElement.length);
for(i = 0; i < formElement.length; i++) {
if(formElement[i].selected == true) {
Name= formElement[i].text; //关键是通过option对象的innerText属性获取到选项文本
//alert(Name);
}
}
var newsld = sld.replace("Nebraska", Name);
layer.mergeNewParams({"sld_body":newsld});
map.addLayer(layer);
}
输入地名:
California
Arizona
Texas
New Mexico
Louisiana
去掉红字部分就不显示边界了：
对道路进行测试
教训：SLD中有汉字不能被解析，最好用英文作为属性值！！！
OpenLayers TileCacheExamplevar sld,map,layer;
function init(){
//下面两个sld有点区别，都是正确的
//sld = "KunMing:test_street UserSelection Kind 6 #0000FF #ff00008 ";
sld="KunMing:test_streetUserSelectionKind6 #0000FF #ff00008 ";
map= new OpenLayers.Map('map');
layer= new OpenLayers.Layer.WMS("MY WMS",
"http://127.0.0.1:8080/geoserver/wms",{
layers: 'KunMing:test_street',
SLD_BODY:sld
});
map.addLayer(layer);
map.addControl(newOpenLayers.Control.LayerSwitcher());
//var lonlat=newOpenLayers.LonLat(-100.63477, 39.28711);
//map.setCenter(lonlat, 4);//指定地图中心与初始缩放级别
map.setCenter(newOpenLayers.LonLat(102.73961, 25.05655), 15);
map.addControl(newOpenLayers.Control.MousePosition());
}
function commit(){
var Name;
var formElement =document.getElementsByName('sel')[0];
// console.log(formElement.length);
for(i = 0; i < formElement.length; i++) {
if(formElement[i].selected == true) {
Name= formElement[i].text; //关键是通过option对象的innerText属性获取到选项文本
//alert(Name);
}
}
var newsld = sld.replace("白云路", Name);
alert(newsld);
layer.mergeNewParams({"sld_body":newsld});
map.addLayer(layer);
}
输入地名:
白龙路
白云路
说明：按钮没有起作用。原因如上所述:SLD中有汉字不能被解析，最好用英文作为属性值！！！
如果把Kind 6改为name 白龙路将不能得到结果。
改进的办法是在shapefile文件中建立一个英文字段，在select菜单中的value属性填上这些英文属性，获取时获取这些value的值，而不是text(表面显示text)。
两个SLD的区别：
Sld1 = "KunMing:test_street UserSelection Kind 6 #0000FF #ff00008 ";
Sld2 = "KunMing:test_street UserSelection Kind 6 #0000FF #ff00008 ";
两者相差红色部分，结果前者显示了原来的默认道路，后者直接显示样式图片。
显示道路名：
sld = "KunMing:test_street UserSelection Kind 6 #0000FF #ff00008 name 宋体20 normal bold true 90400 50 ";
总的来说有以下三种方法：第二种没能实现，可能要把文件放在Tomcat中，IIS拒绝访问，有空可以试下。
1.The client interacts with the WMSusing HTTP GET but the request can reference
a remote SLD：
http://yourfavoritesite.com/WMS?
VERSION=1.1.0&
REQUEST=GetMap&
BBOX=0.0,0.0,1.0,1.0&
LAYERS=Rivers,Roads,Houses&
STYLES=CenterLine,CenterLine,Outline&
WIDTH=400&
HEIGHT=400&
FORMAT=PNG2.The client uses the HTTP GET method but includes the SLD XML documentinline
with the GET request in an SLD_BODY CGI parameter (with appropriate
character encoding)：http://yourfavoritesite.com/WMS?
VERSION=1.0.5&
REQUEST=GetMap&
SRS=EPSG%3A4326&
BBOX=0.0,0.0,1.0,1.0&
SLD=http%3A%2F%2Fmyclientsite.com%2FmySLD.xml&
WIDTH=400&
HEIGHT=400&
FORMAT=PNG2.The client interacts with the WMS usingHTTP POST with the GetMap request
encoded in XML and including an embedded SLD：http://yourfavoritesite.com/WMS?
VERSION=1.0.5&
REQUEST=GetMap&
SRS=EPSG%3A4326&
BBOX=0.0,0.0,1.0,1.0&
SLD_BODY=%3C%3Fxml+version%3D%221.0%22+encoding%3D%22UTF-8%22%
3F%3E%3C!DOCTYPE+StyledLayerDescriptor+SYSTEM+%22http%3A%2F%2Fsom
.site.com%2Fsld%2Fsld_072.xsd%22%3E%3CStyledLayerDescriptor+versi
on%3D%221.0.0%22%3E%3CNamedLayer%3E%3CName%3ERivers%3C%2FName%3E%
3CNamedStyle%3E%3CName%3ECenterLine%3C%2FName%3E%3C%2FNamedStyle%
3E%3C%2FNamedLayer%3E%3CNamedLayer%3E%3CName%3ERoads%3C%2FName%3E
%3CNamedStyle%3E%3CName%3ECenterLine%3C%2FName%3E%3C%2FNamedStyle
%3E%3C%2FNamedLayer%3E%3CNamedLayer%3E%3CName%3EHouses%3C%2FName%
3E%3CNamedStyle%3E%3CName%3EOutline%3C%2FName%3E%3C%2FNamedStyle%
3E%3C%2FNamedLayer%3E%3C%2FStyledLayerDescriptor%3E&WIDTH=400&
HEIGHT=400&
FORMAT=PNG
样式学习告一段落！
这篇关于html动态 %3coption%3e,动态改变SLD的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
