Подскажите пожалуйста как можно реализовать :
нужно от заданной точки нарисовать сектор излучения, в Yandex картах я это реализовал, но сейчас т.к. сделали платным api, нельзя искать адреса на созданной карте.
Хочу перейти на OpenStreetMaps, использую для данных mysql, реализовано на php и javascript
Код: Выделить всё
Point1 = coordSystem.solveDirectProblem([<?php echo $_POST["var1"]; ?>, <?php echo $_POST["var2"]; ?>], [Math.cos((<?php if (empty($_POST["var3"])) { echo 0;} else { echo $_POST["var3"];};?>-60)*Math.PI/180), Math.sin((<?php if (empty($_POST["var3"])) { echo 0;} else { echo $_POST["var3"];};?>-60)*Math.PI/180)], <?php echo $q1;?>);
Point2 = coordSystem.solveDirectProblem([<?php echo $_POST["var1"]; ?>, <?php echo $_POST["var2"]; ?>], [Math.cos((<?php if (empty($_POST["var3"])) { echo 0;} else { echo $_POST["var3"];};?>-50)*Math.PI/180), Math.sin((<?php if (empty($_POST["var3"])) { echo 0;} else { echo $_POST["var3"];};?>-50)*Math.PI/180)], <?php echo $q1;?>);
Point3 = coordSystem.solveDirectProblem([<?php echo $_POST["var1"]; ?>, <?php echo $_POST["var2"]; ?>], [Math.cos((<?php if (empty($_POST["var3"])) { echo 0;} else { echo $_POST["var3"];};?>-40)*Math.PI/180), Math.sin((<?php if (empty($_POST["var3"])) { echo 0;} else { echo $_POST["var3"];};?>-40)*Math.PI/180)], <?php echo $q1;?>);
Point4 = coordSystem.solveDirectProblem([<?php echo $_POST["var1"]; ?>, <?php echo $_POST["var2"]; ?>], [Math.cos((<?php if (empty($_POST["var3"])) { echo 0;} else { echo $_POST["var3"];};?>-30)*Math.PI/180), Math.sin((<?php if (empty($_POST["var3"])) { echo 0;} else { echo $_POST["var3"];};?>-30)*Math.PI/180)], <?php echo $q1;?>);
Point5 = coordSystem.solveDirectProblem([<?php echo $_POST["var1"]; ?>, <?php echo $_POST["var2"]; ?>], [Math.cos((<?php if (empty($_POST["var3"])) { echo 0;} else { echo $_POST["var3"];};?>-20)*Math.PI/180), Math.sin((<?php if (empty($_POST["var3"])) { echo 0;} else { echo $_POST["var3"];};?>-20)*Math.PI/180)], <?php echo $q1;?>);Получается здесь мы берем координаты, если азимут пришел берем его, если нет - то считаем его нулём, -60,50,40,30,20,10,0,+10,+20,+30,+40,+50,+60 и т.д. это отклонение каждой точки
т.е. всего 3 сектора получается по 120 градусов каждый (всего 360)
берем расстояние и накладываем на карту.
Как это реализовать в OSM + leaflet?
Точку поставил на карту, а как сектор нарисовать не пойму
Код: Выделить всё
<html>
<head>
<meta charset="utf-8" />
<title>OpenStreetMap</title>
<script src="http://cdn.leafletjs.com/leaflet-0.5/leaflet.js"></script>
<script src="http://api-maps.yandex.ru/2.0/?load=package.map&lang=ru-RU" type="text/javascript"></script>
<script src="http://maps.google.com/maps/api/js?v=3.2&sensor=false"></script>
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="l_geosearch_master/js/l.control.geosearch.js"></script>
<script src="l_geosearch_master/js/l.geosearch.provider.openstreetmap.js"></script>
<link rel="stylesheet" href="l_geosearch_master/css/l.geosearch.css" />
<script src="layer/tile/Yandex.js"></script>
<script src="layer/tile/Google.js"></script>
<style>
html, body, #map {
width: 100%; height: 100%; padding: 0; margin: 0;
}
</style>
</head>
<body>
<div id="map"></div>
<script type='text/javascript'>
var map = new L.Map('map', {center: new L.LatLng(<?php echo $_POST["var1"]; ?>, <?php echo $_POST["var2"]; ?>), zoom: 16, zoomAnimation: false });
var LeafIcon = L.Icon.extend({
options: {
iconSize: [23, 23],
iconAnchor: [11.5,11.5],
popupAnchor: [0,0]
}
});
var greenIcon = new LeafIcon({iconUrl: 'img/cross-blue.png'}),
cinemaIcon = new LeafIcon({iconUrl: 'img/cinema.png'}),
restaurantIcon = new LeafIcon({iconUrl: 'img/restaurant.png'});
var osm = new L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© created by <a>AgentSmith</a>'
}).addTo(map);
var yndx = new L.Yandex();
var googleLayer = new L.Google('ROADMAP');
new L.Control.GeoSearch({
provider: new L.GeoSearch.Provider.OpenStreetMap()
}).addTo(map);
new L.Control.Layers({'OSM':osm, "Яндекс":yndx, "Google":googleLayer}).addTo(map);
L.marker([<?php echo $_POST["var1"]; ?>, <?php echo $_POST["var2"]; ?>] , {icon: greenIcon}).addTo(map).bindPopup("<?php echo ''.$_POST['var4'].'-'.$_POST['var5'].' азимут - '.$_POST['var3'].''?>").openPopup();
var polyline = L.polyline([[<?php echo $_POST["var1"]; ?>, <?php echo $_POST["var2"]; ?>]],
{color: 'red',
weight: 3,
opacity: 0.5,
smoothFactor: 1}).addTo(map);
</script>
</body>
</html>