JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://openlayers.org/api/OpenLayers.js"></script>
<table><tr><td>
    <!-- Left Column -->
    Virtual Layers<hr/>
    <label>
        <input id="LargeStarLayer" type="checkbox"/>
        Large Star
    </label>
    <hr/><label>
    <input id="SmallStarLayer" type="checkbox"/>
    Small Stars
    </label>    
</td><td>
    <!-- Right Column -->
    <div id="map-div" style="width:450px;height:430px;"></div>
</td></tr></table>

CSS

html{font-family:arial;}

JavaScript

var smallstars = [];
var largestars = [];
var pointLayer;

map = new OpenLayers.Map({
    div: "map-div",
    projection: new OpenLayers.Projection('EPSG:900913'),
    'displayProjection': new OpenLayers.Projection('EPSG:4326')
});

var osm = new OpenLayers.Layer.OSM();
map.addLayer(osm);

var long = 78.042068;
var lat = 27.173768;
var centerlonlat = new OpenLayers.LonLat(long, lat);

centerlonlat = centerlonlat.transform(map.displayProjection, map.projection);
var zoom = 16;
map.setCenter(centerlonlat, zoom);


myPoint = new OpenLayers.Geometry.Point(long, lat).transform(map.displayProjection, map.projection);


layerStyle = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']);
pointLayer = new OpenLayers.Layer.Vector("Layer Name", {
    style: layerStyle
});
map.addLayer(pointLayer);

var sampleStyle = OpenLayers.Util.extend({}, layerStyle);
sampleStyle.fillColor = "blue"; // the main color of the shape
sampleStyle.graphicName = "star"; // another good shape is "star"
sampleStyle.pointRadius = 10; // controls the size of the marker
sampleStyle.strokeColor = "blue"; // the border color of the shape
sampleStyle.strokeWidth = 3; // border width
sampleStyle.fillOpacity = 1; // from 0 to 1
sampleStyle.graphicOpacity = 1; // from 0 to 1

largestarfeature = new OpenLayers.Feature.Vector(myPoint, null, sampleStyle);
largestars.push(largestarfeature);
pointLayer.addFeatures([largestarfeature]);

rotatedStyle = OpenLayers.Util.extend({}, sampleStyle);
rotatedStyle.rotation = 45;
rotatedStyle.pointRadius = 7;
rotatedStyle.fillOpacity = 0.7;
rotatedStyle.graphicOpacity = 0.7;
rotatedStyle.strokeWidth = 0;

// add my own rotatedPoint and rotatedPoint2
rotatedPoint = new OpenLayers.Geometry.Point(78.041, 27.173768).transform(map.displayProjection, map.projection);
rotatedPointFeature = new OpenLayers.Feature.Vector(rotatedPoint, null, rotatedStyle)
smallstars.push(rotatedPointFeature);

rotatedPoint2 = new OpenLayers.Geometry.Point(78.043,...