JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://openlayers.org/dev/OpenLayers.js"></script>
<link rel="stylesheet" href="http://openlayers.org/dev/theme/default/style.css">
<div style="width: 600px; height: 300px; border: 1px solid black"
id="map"></div>
<div id="info"></div>
JavaScript
$(window).load(function() {
var map = new OpenLayers.Map({
div : "map"
});
var layerOSM = new OpenLayers.Layer.OSM();
map.addLayer(layerOSM);
map.setCenter(new OpenLayers.LonLat(120, 30), 6);
var markers = new OpenLayers.Layer.Markers("Markers");
map.addLayer(markers);
myMarker = new OpenLayers.Marker(new OpenLayers.LonLat(120, 30));
markers.addMarker(myMarker);
map.events.register("click", map, function(evt) {
var pos = map.getLonLatFromPixel(evt.xy);
updateMaker(myMarker, pos);
});
function updateMaker(myMarker, pos) {
myMarker.moveTo(myMarker.map.getPixelFromLonLat(pos));
}
});