[OpenLayers-Users] text over of a map

Wed Jul 15 12:04:17 PDT 2015

Hi,
I hope anybody will help a dummy to solve the problem. I want to place
two texts at different positions over a map.
I took an API-example and tried to simplify it for my task. The above
script works, but it places BOTH texts at BOTH positions.
Which is the misunderstanding? Can I find everywhere more explanations
than in the API-docs and exmaples?
Which is the easiest solution for the following script?

<!DOCTYPE html>
<html>
<head>
<title>Clustering example</title>
<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/ol3/3.7.0/ol.css"
type="text/css">
<script
src="https://cdnjs.cloudflare.com/ajax/libs/ol3/3.7.0/ol.js"></script>
</head>
<body>
    <div id="map" class="map"></div>

<script>
var features = new Array(2);
features[0] = new ol.Feature(new ol.geom.Point([4000000, 4000000]));
features[1] = new ol.Feature(new ol.geom.Point([6000000, 2000000]));

var styles = new Array();
styles[0] = new ol.style.Style({
	text: new ol.style.Text({
		text: 'hello world!',
		fill: new ol.style.Fill({
			color: '#fff'
		})
	})
});

styles[1] = new ol.style.Style({
	text: new ol.style.Text({
		text: 'hello new world!',
		fill: new ol.style.Fill({
			color: '#fff'
		})
	})
});

var clusters = new ol.layer.Vector({
		source: new ol.source.Vector({
			features: features,
			}),
 		style: styles,
});

var raster = new ol.layer.Tile({
		  source: new ol.source.MapQuest({
			layer: 'sat'
		})
});

var map = new ol.Map({
  layers: [raster, clusters],
  target: 'map',
  view: new ol.View({ center: [0, 0], zoom: 2 })
});

</script>
</body>
</html>
-- 