这就是我的想法。我想用GPS获取用户位置。我没有发送当前位置,而是想计算平方公里或米。
----------------------------------
| |
| |
| |
| |
| . |
| ^ |
| My current position |
| |
| |
| |
----------------------------------
正如您在上图中所看到的,我现在的位置,但我想计算HTML5或Ionic周围的整个区域将更受欢迎。
更新
在上图中,红点是我的位置,我需要将整个区域放在红色矩形中。获取数据库中的那个商店。我查看了多边形区域公式,但这需要几个顶点,地理位置我只获得经度和纬度两个坐标。我怎么用这两点来做到这一点?
更新
我找到了解决方案here,但此解决方案是继续跟踪用户的当前位置,并且在calculateDistance
函数中公式使用当前位置(经度和纬度)和跟踪位置(经度和纬度),即{ {1}}
这对我的第二个场景非常好,但首先我不想跟踪用户的位置。首先,我简单地获取当前用户位置(经度和纬度),从中计算区域并将其发送到服务器。现在我不确定我将如何实现这一目标。有什么帮助吗?
答案 0 :(得分:6)
I've created a circle in google maps and then got his bounds, which return a square bounding boxes.
function getBounds(latLng, radius) {
/*
* Params:
* latLng: google maps LatLng object or object literal // example: { lat: -34.397, lng: 150.644 }
* radius: Number(int) in Miters. For example 1000 will be 1 sq Kilometer
* Returns:
* object literal in the following format:
* {
northEast: {
lat: (float),
lng: (float),
},
southWest: {
lat: (float),
lng: (float),
},
}
* */
const circle = new google.maps.Circle({
center: latLng,
radius: radius
});
const bounds = circle.getBounds();
const northEast = bounds.getNorthEast();
const southWest = bounds.getSouthWest();
return {
northEast: {
lat: northEast.lat(),
lng: northEast.lng(),
},
southWest: {
lat: southWest.lat(),
lng: southWest.lng(),
},
};
}
I took the library to add a short snippet for you to see if this is the right answer for what you were looking for. Once you click on the map you will see a marker and the triangle around it.
Note: Please copy the code and add your google map API key. Without your API key, the map will fail to load.
let map;
let marker;
let rectangle;
function initMap() {
const latLng = {
lat: -34.397,
lng: 150.644
};
const radius = 1000;
map = new google.maps.Map(document.getElementById('map'), {
center: latLng,
zoom: 11,
});
google.maps.event.addListener(map, 'click', function(event) {
const location = event.latLng;
const bounds = getBounds(location, 1000);
console.log(bounds);
addRectangle(bounds);
addMarker(location);
});
}
function addMarker(location) {
if (marker) {
marker.setMap(null);
}
marker = new google.maps.Marker({
position: location,
map: map,
});
}
function addRectangle(bounds) {
if (rectangle) {
rectangle.setMap(null);
}
rectangle = new google.maps.Rectangle({
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35,
map: map,
bounds: {
north: bounds.northEast.lat,
south: bounds.southWest.lat,
east: bounds.northEast.lng,
west: bounds.southWest.lng,
},
});
}
function getBounds(latLng, radius) {
/*
* Params:
* latLng: google maps LatLng object or object literal // example: { lat: -34.397, lng: 150.644 }
* radius: Number(int) in Miters. For example 1000 will be 1 sq Kilometer
* Returns:
* object literal in the following format:
* {
northEast: {
lat: (float),
lng: (float),
},
southWest: {
lat: (float),
lng: (float),
},
}
* */
const circle = new google.maps.Circle({
center: latLng,
radius: radius
});
const bounds = circle.getBounds();
const northEast = bounds.getNorthEast();
const southWest = bounds.getSouthWest();
return {
northEast: {
lat: northEast.lat(),
lng: northEast.lng(),
},
southWest: {
lat: southWest.lat(),
lng: southWest.lng(),
},
};
}
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html,
body {
height: 100%;
margin: 0;
padding: 0;
}
<script src="https://maps.googleapis.com/maps/api/js?callback=initMap" async defer></script>
<div id="map"></div>
答案 1 :(得分:-1)
这是一个函数(使用ES6),它采用方形的平方公里的纬度,经度和面积,并返回一个对象,该对象包含以该位置为中心的四边形(两个纬度和两个经度)。
function getBoundaries(lat, lon, area) {
// angle conversions
const toRad = t => t * Math.PI / 180;
const toDeg = t => t * 180 / Math.PI;
// radius of the Earth (km)
const radius = 6371;
// calculate distance to the sides of the square
const dist = Math.sqrt(area)/2;
// calculate change in coordinates
const dLat = toDeg(dist / (radius * Math.cos(toRad(lon))));
const dLon = toDeg(dist / radius);
return {
north: lat + dLat,
south: lat - dLat,
east: lon + dLon,
west: lon - dLon
}
}
例如,如果你想要一个面积为10平方公里的正方形,居中于40°N 74°W,那么你的正方形将是
const square = getBoundaries(40, -74, 10);
// {north: 40.051587793956195, south: 39.948412206043805, east: -73.98578047688149, west: -74.01421952311851}