I want to convert this project for other use from OL2 to OL4 but I can't convert the code and get back a map,


here the OL2 code:

  layer = new OpenLayers.Layer.WMS("UKMap", "http://www.trafficorders.uk/cgi-bin/wmsmaps", {
    layers: "bgmap"
  }, {
    isBaseLayer: true,
    transitionEffect: 'resize',
    singleTile: false,
    ratio: 1.1

  var areaStyMap = new OpenLayers.StyleMap({
    "default": new OpenLayers.Style({
      fill: true,
      fillOpacity: 1,
      strokeColor: "#000000",
      fillColor: "${MapColour}",
      strokeWidth: 1

    "select": new OpenLayers.Style({
      strokeColor: "#FFFFFF",
      fillOpacity: 1,
      strokeWidth: 2,
      fillColor: "#FF9900",
      label: "${Name}",
      labelOutlineWidth: 3,
      labelOutlineColor: '#ffffff',
      fontSize: "12px",
      fontFamily: "Arial, Courier New",
      fontWeight: "bold"

  var strat = new OpenLayers.Strategy.Fixed();
  var pmproto = new OpenLayers.Protocol.WFS({
    url: "http://www.trafficorders.uk/cgi-bin/mapserv?map=/var/www/vhosts/trafficorders.uk/httpdocs/maps/wfsareas.map",
    featureType: "la_areas",
    featureNS: "http://mapserver.gis.umn.edu/mapserver",
    featurePrefix: "ms"
  arealayer = new OpenLayers.Layer.Vector("la_areas", {
    strategies: [strat],
    protocol: pmproto,
    styleMap: areaStyMap

and here my new code:

var vector = new ol.layer.Vector({
  source: new ol.source.Vector({
    url: 'http://www.traffwebdev.uk/cgi-bin/mapserv?map=/var/www/vhosts/traffwebdev.uk/httpdocs/hosted/maps/wfsareas.map',
    format: new ol.format.WFS({
      featureType: ["la_areas"],
      featureNS: "http://mapserver.gis.umn.edu/mapserver",
      featurePrefix: "ms"

the featureNS seems to do not works, I don't have nothing back while in the old code I have a collection of features.

What I want to achieve is something like this but with WFS instead of geoJson


  • what request get's sent to the server in each case? – nmtoken Jun 5 '18 at 10:41
  • well that is all my code, I supposed that the request will be sent automatically? I don't quite understand how OL2 works and how to convert it, there is no such strategies in OL4 – Sebastiano Jun 5 '18 at 10:43
  • i found this openlayers.org/en/latest/apidoc/ol.loadingstrategy.html but I don't know if it's what I really need. when I load the page a request to traffwebdev.uk/cgi-bin/mapserv?map=/var/www/vhosts/… is sent automatically but without respond while in OL2 in the live system I have an xml back – Sebastiano Jun 5 '18 at 10:47
  • I'm trying to understand if the actual request is different, different versions perhaps, or if the request is the same and the problem lies in handling the response – nmtoken Jun 5 '18 at 12:10
  • well I copied the whole website into the dev domain and changed the code with OL4, mapserver is the same and the map file also. Also what I don't understand is that if you open the URL in OL2 (trafficorders.uk/cgi-bin..) you have an error but still you have a respond back while in OL4 you just have the 2 filed in the xml file – Sebastiano Jun 5 '18 at 12:40

You will find 2 solutions:

Normally according to the current code you should use the first solution e.g with map projection EPSG 27700 (surely related to the fact that your map is UK only)

| improve this answer | |
  • thanks you very much it almost work, I just have the error Cannot read property 'getAxisOrientation' of null I setup the projection and extent in this way Proj4js.defs["EPSG:27700"] = "+proj=tmerc +lat_0=49 +lon_0=-2 +k=0.9996012717 +x_0=400000 +y_0=-100000 +ellps=airy +datum=OSGB36 +units=m +no_defs"; var projection = new ol.proj.Projection({ code: 'EPSG:27700', getPointResolution: function(r) { return r; }, units: 'm' }); var extent = [0, 0, 700000, 1000000]; projection.setExtent(extent); – Sebastiano Jun 6 '18 at 10:01
  • this is the code I'm using traffwebdev.uk/hosted/js/host.js – Sebastiano Jun 6 '18 at 10:28
  • Simply don't use it this file! This version of Proj4, 1.x is outdated since years! You need to switch to a recent version of Proj4 (2.x). You can get the required infos in both demos e.g <script src="http://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.14/proj4.js"></script> and <script src="http://epsg.io/27700.js"></script> If it's just about hosting, download them. FYI, the equivalent of the beginning of your code is in epsg.io/27700.js – ThomasG77 Jun 6 '18 at 10:30
  • whit those links and your code it enters in an infinite loops of requests – Sebastiano Jun 6 '18 at 10:35
  • It's somewhere else in your code as both provided demos work. I can't fix bug(s) from your own code, just can help about things described in the perimeter of your question here. Sorry – ThomasG77 Jun 6 '18 at 10:39

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.