JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.openlayers.org/dev/OpenLayers.js"></script>
<div id="map" style="width:300px; height:300px;"></div>

JavaScript

// Permanent Popup?
var mapa;
OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
OpenLayers.ImgPath = "/openlayers/img/"
mapa = new OpenLayers.Map('map',{
    controls: [
            new OpenLayers.Control.Attribution(),
            new OpenLayers.Control.Navigation(),
            new OpenLayers.Control.PanZoomBar(),
    ],
    theme: null
});
var vectorLayer = new OpenLayers.Layer.Vector("vector");
var osm = new OpenLayers.Layer.OSM( " Open Street Map" );
var markers = new OpenLayers.Layer.Markers( "Ruta" );
$.each(info, function(i, data){
    // popup
    var vector = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(0, 0),{dataItem:'one'})
    vector.idunidad = data.idunidad;
    vectorLayer.addFeatures(vector);
    arrPlaca.push(vector);
    var feature = vectorLayer.features[i];
    var popup = new OpenLayers.Popup(null,
        feature.geometry.getBounds().getCenterLonLat(),
        new OpenLayers.Size(50,30),
        '<span>' + feature.attributes.dataItem + "</span>"
    );
    mapa.addPopup(popup);
});
var lonlat  = new OpenLayers.LonLat(-74.075833,4.598056);
var proj_1  = new OpenLayers.Projection("EPSG:4326");
var proj_2  = new OpenLayers.Projection("EPSG:900913");
var centrar = lonlat.transform(proj_1,proj_2);
mapa.addLayers([osm,markers]);
mapa.setCenter(centrar, 5);
mapa.addControl(new OpenLayers.Control.LayerSwitcher());