WeatherAlerts Layer

The alk.layer.WeatherAlertsLayer layer is used to overlay live weather alerts on your map.

var baseMap = new alk.layer.BaseMapLayer({
  sourceOptions: {
    serviceOptions: {
      style: alk.val.Style.Monochrome
    }
  }
});
var weatherAlerts = new alk.layer.WeatherAlertsLayer();

var map = new ol.Map({
  target: 'map',
  layers: [baseMap, weatherAlerts],
  view: new ol.View({
    center: ol.proj.transform([-96, 38], alk.val.SRS.EPSG4326, alk.val.SRS.EPSG3857),
    zoom: 4
  })
});

var currentPopup;
map.on('click', function (evt) {
  if (currentPopup) {
    map.removeOverlay(currentPopup);
  }
  // Returns the first feature with a weatherAlert.
  var feature = map.forEachFeatureAtPixel(evt.pixel, function (feature) {
    if (feature.get('weatherAlert')) {
      return feature;
    }
  });

  if (feature) {
    var alert = feature.get('weatherAlert');
    var popup = new alk.overlay.WeatherAlertPopup({
      autoPan: true,
      weatherAlert: alert
    });
    map.addOverlay(popup);
    popup.setPosition(evt.coordinate);
    currentPopup = popup;
    $(popup.closeElement).on('click', function () {
      this.blur();
      popup.setPosition(undefined);
      map.removeOverlay(popup);
    });
  }
});