I have created a WEB MAP using Openlayers-GeoServer-PostGIS....

The Label of one of the Vector feature layer is not visible in Internet Explorer 8(IE 8) ,but clearly visible in Google Chrome 27.0.1453.94....

As most of my map viewers use IE8 so it is important to have the full map along with label in IE8...

part of the code used is as follows...

var vectorLayer = new OpenLayers.Layer.Vector("SupplyOff");


$qry_xy="select * from ci_master@ltdvlp  where  x is not null  AND GIS_SOURCE_CODE LIKE '01%' AND ROWNUM < 5";

$parsed =oci_parse($db_conn_prod,$qry_xy);
echo $nrows3;

for($i=0;$i<$nrows3;$i++)    {

var description_new = '<?php echo $consno; ?>';
            var x = '<?php echo $x;  ?>';
            var y ='<?php echo $y;  ?>';
        var cons ='<?php echo $consno; ?>';
            var type = '<?php echo $source; ?>';

    vectorLayer.addFeatures([new OpenLayers.Feature.Vector(
                new OpenLayers.Geometry.Point(x,y ),

                    //Attributes go here
                    description:'cons: '+cons,
                    size: 5 + (Math.floor(Math.random() * 20)),
                    label: 'F'+cons,
                    strokeWidth: (Math.floor(Math.random() * 10))



    //Create a style object to be used by a StyleMap object
    var vector_style = new OpenLayers.Style({
        'cursor': 'pointer',
        'fillColor': '#2bff05',
        'fillOpacity': .8,
        'fontColor': '#a52505',
        'label': '${label}',
        'pointRadius': '${size}',
        'strokeColor': '#232323',
        'strokeDashstyle': 'solid',
        'strokeWidth': '${strokeWidth}',


    //  style object we just created
    var vector_style_map = new OpenLayers.StyleMap({
        'default': vector_style

    //Add the style map to the vector layer
    vectorLayer.styleMap = vector_style_map;

var controls = {
      selector: new OpenLayers.Control.SelectFeature(vectorLayer, { onSelect: createPopup, onUnselect: destroyPopup })

    function createPopup(feature) {
      feature.popup = new OpenLayers.Popup.FramedCloud("pop",
          '<div class="markerContent">'+feature.attributes.description+'</div>',
          function() { controls['selector'].unselectAll(); }


    function destroyPopup(feature) {
      feature.popup = null;


View in Google Chrome

View in IE 8

  • you have a trailing comma - 'strokeWidth': '${strokeWidth}', Try removing it – Ian Turton May 26 '13 at 6:43
  • I have removed it....but same problem.... – Sandipan Saha May 26 '13 at 11:08
  • Did you ever get to the bottom of this? – user27152 Feb 20 '14 at 9:10

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.