openLayers-Defining custom rules to style featuresl;

<script type="text/javaScript">

var map=new OpenLayers.Map("ch07_custom_rules");

var osm=new OpenLayers.Layer.OSM():

map.addLayer(osm);

map.setCenter(new OpenLayers.LonLat(40,50).transfrom(new OpenLayers.Projectoin("EPSG:4326"),new  OpenLayers.Projection("EPSG:900913")),3);

var aRule=new OpenLayers.Rule(

filter:new OpanLayers.Rule({

type:OpenLayers.Filter.Comparison.LESS_THAN,

property:"AREA",

value:10000}),

symbolizer:

{

   fillColof:"#EBC137",

    fillOpacity:0.5,

    strokeColor:"black"

}

);

var bRule=new OpenLayers.Rule({

filter:new OpenLayers.Filter.Logical.({

 type:OpenLayers.Filter.Logical.ANF.

filters:[

new OpeanLayers.FIlter.Comparison({

 type:OpenLayers.Filter.Comparison.GREATER_THAN,

property:"AREA":

value:10000  

}),

new OpenLayers.Filter.Comparsion({

type:OpenLayers.Filter.Comparsion.LESS_THAN_OR_EQUAL_TO,

property:"AREA",

value:25000

})

]

}),

symbolizer:

{

 fillColor:"#E38C2D";

fillOpacity:0.7,

strokeColor:"black"

}

})

var dRule=new OpenLayes.Rule({

filter：OpenLayers.Filter.Logicla.AND,

filters:[

new OpenLayers.Filter.Comparison({

type:OpenLayers.Filter.Comparsion.GREATER_THAN,

properyp:"AREA",

value:5000

}),

new OpenLayers.Filter.Comparison({

type:OpenLayers.Filter.Comparsion.LESS_THAN_OR_EQUQL_TO,

prpperty:"AREA"

,

value:100000

})]

symbolizer:

{

 filColor:"#771e10",

fillOpacity:0.7,

strokeColor:"black"

}

});

var eRule=new OpenLayers.Rule({

filter:new OpenLayers.Filter.Comparison({

type:OpenLayers.Filter.Comparison.GREATER_THAN_OR_EQUAL_TO,

property:"AREA",

value:100000

}),

symbolizer:

{

   fillcolor:"#48110c",

   fillOpacity:0.7,

   strokeColor:"black"

}

});

var style=new OpenLayers.Style();

style.addRules([aRule,bRule,cRule,eRule]);

var format=new OpenLayers.Format.SLD();

console.log(format.write(style));

map.addLayer(new OpenLayers.Layer.Vecor("WORLD cities(geoJSON)",{

protocol:new OpenLayers.Protocol.HTTP(

{}

)，

styleMap:new OpenLayers.StyleMap(style),

strategies:[new OpenLayers.Strategy.Fixed()]

}));

stuyleing clustered features:

<script type="text/javascript">

var map=new OpenLayers.Map("ch07_cluster_number_style");

var osm=new OpenLayers.Layer.OSM():

map.addLayer(osm);

map.setCenter(new OpenLayers.LonLat(0,20).transform(new OpanLayers.Projection("EPSG:4326"),new OpenLayers.Projection("EPSG:900913")),2);

var cities=new OpenLayers.Layer.Vector("world citires ",{

protocol:new OpenLayers.Protocol.HTTP({

url:"http://..../world_cities.json",

format:new OpenLayers.Format.GeoJSON()

}),

strategies:[new OpenLayers.Strategy.Fixed(),new OpenLayers.Strateg.Cluster({

distance:25

})],

stylMap:new OpenLayers.StyleMap({

'default':new OpenLayers.Style({

stokeWidth:'${strokeFunction},

strokeOpacity:0.5,

strokeColor:"#88aaaa",

fillColor:"#99cc55",

fillOpacity:0.5

pointRadius:'${radiusfunction}',

lable:"${count}"

fontColor:"#ffffff"

},{

context:{

strokeFunction:function(feature){

var count=feature.attributes.count;

var stk=Math.max(0.1*count,1);

return stk;

},radiusfunction:function(feature){

var count=feature.attribures.count;

var radius=Math.max(0.06*count,7);

return radius;

}

}

}

})

});

map.addLayer(cities);

</script>

</script>