Мне нужно на карте в нужных координатах выводить текст. Маленькими буковками. (есть километровые столбики вот как раз рядом с этими столбиками и нужно вывести например "10км", "148км")
Спасибо.
Код: Выделить всё
<!DOCTYPE html>
<html>
<head>
<script src="http://openlayers.org/dev/OpenLayers.js"></script>
<style type="text/css">
#mapdiv {
width: 1000px;
height: 1000px;
border: 1px solid #dddddd;
}
</style>
<script>
function init() {
map = new OpenLayers.Map("mapdiv");
var epsg4326 = new OpenLayers.Projection("EPSG:4326");
var epsg900913 = new OpenLayers.Projection("EPSG:900913");
//первоначальные координаты
var center = new OpenLayers.LonLat(60.6340143032,56.8659060093).transform(epsg4326, epsg900913);
var center2 = new OpenLayers.LonLat(60.6320143032,56.8259060093).transform(epsg4326, epsg900913);
var epsilon = 0.0001;
//точки
var points = [
new OpenLayers.Geometry.Point(center.lon, center.lat),
new OpenLayers.Geometry.Point(center.lon+1000, center.lat),
new OpenLayers.Geometry.Point(center.lon, center.lat+1000)
];
var points2 = [
new OpenLayers.Geometry.Point(center2.lon +8, center2.lat + 9),
new OpenLayers.Geometry.Point(center2.lon+1000, center2.lat),
new OpenLayers.Geometry.Point(center2.lon + 9, center2.lat+900)
];
//стиль к точнам и линиям
var styles = new OpenLayers.StyleMap({
"default": new OpenLayers.Style(null, {
rules: [
new OpenLayers.Rule({
//объект выделения линии
symbolizer: {
"Line": {
//толщина линии
strokeWidth: 20,
//прозрачность линии
strokeOpacity: 0.5,
//цвет линии
strokeColor: "#0000FF"
}
}
})
]
}), });
//Создание слоёв
var base = new OpenLayers.Layer.OSM();
var vectors_lns = new OpenLayers.Layer.Vector("Vector Layer (lines)", {styleMap: styles});
map.addLayers([base, vectors_lns]);
//Добавление объектов в линейный слой
var feture_d = [new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(points),{attr1: "DR1"})];
var feture_d2 = [new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(points2),{attr1: "DR2"})];
map.addControl(new OpenLayers.Control.SelectFeature(
vectors_lns,
{
hover: true,
onSelect: function(f) {
alert(f.attributes.attr1);
},
autoActivate: true
})
);
vectors_lns.addFeatures(feture_d);
vectors_lns.addFeatures(feture_d2);
map.setCenter(center, 12);
}
</script>
</head>
<body onload="init()">
<div id="mapdiv"></div>
</body>
</html>
