repeaterPlot = new ol.layer.Image({
 title: "Plot",
 visible: true,
 source: new ol.source.ImageStatic({
    attributions: [new ol.Attribution({
      html: "<a href=\"https://cloudrf.com/\" target=\"_blank\">CloudRF</a>"
    })],
    url: 'https://plot.brandmeister.network/plots/311042.png',
    crossOrigin: '',
    projection: 'EPSG:4326',
    imageExtent: [-122.795733,37.655381,-120.494067,39.455379]
  }),
  opacity: 0.6
});
var plotLegend = function(options) {
  var element = document.createElement('div');
  element.className = 'ol-unselectable ol-control';
  element.id = 'legend-div';
  element.style.background = "no-repeat url('https://plot.brandmeister.network/legend.png')";
  element.style.display = 'block';
  element.style.bottom = "0px";
  element.style.left = "10px";
  element.style.width = "28px";
  element.style.height = "170px";

  ol.control.Control.call(this, {
    element: element
  });
};
repeaterPlot.on('propertychange', function(e) {
  if (e.key === 'visible') {
    if (e.oldValue === true) {
      document.getElementById("legend-div").style.visibility = "hidden";
    } else {
      document.getElementById("legend-div").style.visibility = "visible";
    }
  }
});