效果:

脚本:
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
- <title>耕地分布图</title>
- <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
- <script src="Js/jquery-1.3.2.js" type="text/javascript"></script>
- <script src="Js/GeoUtils.js" type="text/javascript"></script>
- <style type="text/css">
- html,body
- {
- height:100%;
- margin:0;
- }
- </style>
- </head>
-
- <body>
- <div style="width:100%; height:100%;z-index:9;border:1px solid gray" id="container"></div>
- </body>
- </html>
- <script type="text/javascript">
- var map = new BMap.Map("container", { mapType: BMAP_HYBRID_MAP });
- map.centerAndZoom(new BMap.Point(112.244629, 32.094896), 15);
- map.enableScrollWheelZoom();
- map.addControl(new BMap.NavigationControl());
- map.addControl(new BMap.MapTypeControl());
- map.setCurrentCity("襄阳");
-
-
- fun(1, "112.254474,32.088357", "new BMap.Point(112.25221,32.091263),new BMap.Point(112.252785,32.091202),new BMap.Point(112.252929,32.090621),new BMap.Point(112.253576,32.090407),new BMap.Point(112.253576,32.090896),new BMap.Point(112.256199,32.090468),new BMap.Point(112.256558,32.091416),new BMap.Point(112.258319,32.091355),new BMap.Point(112.256055,32.085114),new BMap.Point(112.254007,32.085451),new BMap.Point(112.252785,32.085512),new BMap.Point(112.252282,32.085145),new BMap.Point(112.251851,32.085145),new BMap.Point(112.251635,32.084625),new BMap.Point(112.251025,32.084533),new BMap.Point(112.252138,32.091018)", ‘已播‘, ‘green‘);
- fun(2, "112.244543,32.085696", "new BMap.Point(112.24086,32.087332),new BMap.Point(112.244561,32.087669),new BMap.Point(112.248065,32.087791),new BMap.Point(112.248658,32.087883),new BMap.Point(112.249125,32.086047),new BMap.Point(112.24952,32.086063),new BMap.Point(112.250023,32.084258),new BMap.Point(112.241435,32.082973),new BMap.Point(112.240609,32.084548)", ‘未播‘, ‘blue‘);
- fun(3, "112.248244,32.088342", "new BMap.Point(112.247737,32.087975),new BMap.Point(112.248442,32.089149),new BMap.Point(112.248536,32.089149),new BMap.Point(112.248572,32.088036)", ‘未播‘, ‘green‘);
-
-
- function fun(i,xy,arr,wb,ys) {
-
- eval("var secRingCenter" + i+" = new BMap.Point("+xy+")");
- eval("var secRing"+i+" = ["+arr+"]");
-
- eval("var secRingPolygon" + i + "= new BMap.Polygon(secRing" + i + ", { strokeColor: \"" + ys + "\", strokeWeight: 4})");
-
-
-
- map.addOverlay(eval("secRingPolygon"+i));
-
- var resultArea = BMapLib.GeoUtils.getPolygonArea(eval("secRingPolygon" + i));
-
-
- eval("secRingPolygon"+i).addEventListener("mouseover", function () {
- eval("secRingPolygon" + i).setStrokeColor("red");
-
- map.addOverlay(eval("secRingLabel"+i));
-
- });
- eval("secRingPolygon"+i).addEventListener("mouseout", function () {
- eval("secRingPolygon" + i).setStrokeColor(ys);
-
- map.removeOverlay(eval("secRingLabel"+i));
- });
- eval("secRingPolygon"+i).addEventListener("click", function () {
- map.zoomIn();
- eval("secRingPolygon" + i).setStrokeColor(ys);
-
- map.setCenter(eval("secRingCenter"+i));
- });
-
- eval("var secRingLabel" + i + "= new BMap.Label(\"<b>" + wb + " 面积(㎡):" + Math.floor(resultArea) + "</b>\", { offset: new BMap.Size(0, 0), position: secRingCenter" + i + "})");
- eval("secRingLabel"+i).setStyle({ "z-index": "999999", "padding": "2px", "border": "1px solid #ccff00" });
- }
- </script>
GeoUtils.js
-
-
-
-
-
-
-
-
-
-
- var BMapLib = window.BMapLib = BMapLib || {};
- (function () {
-
-
- var EARTHRADIUS = 6370996.81;
-
-
- var GeoUtils =
-
- BMapLib.GeoUtils = function () {
- }
-
-
- GeoUtils.isPointInRect = function (point, bounds) {
-
- if (!(point instanceof BMap.Point) ||
- !(bounds instanceof BMap.Bounds)) {
- return false;
- }
- var sw = bounds.getSouthWest();
- var ne = bounds.getNorthEast();
- return (point.lng >= sw.lng && point.lng <= ne.lng && point.lat >= sw.lat && point.lat <= ne.lat);
- }
-
-
- GeoUtils.isPointInCircle = function (point, circle) {
-
- if (!(point instanceof BMap.Point) ||
- !(circle instanceof BMap.Circle)) {
- return false;
- }
-
-
- var c = circle.getCenter();
- var r = circle.getRadius();
-
- var dis = GeoUtils.getDistance(point, c);
- if (dis <= r) {
- return true;
- } else {
- return false;
- }
- }
-
-
- GeoUtils.isPointOnPolyline = function (point, polyline) {
-
- if (!(point instanceof BMap.Point) ||
- !(polyline instanceof BMap.Polyline)) {
- return false;
- }
-
-
- var lineBounds = polyline.getBounds();
- if (!this.isPointInRect(point, lineBounds)) {
- return false;
- }
-
-
-
- var pts = polyline.getPath();
- for (var i = 0; i < pts.length - 1; i++) {
- var curPt = pts[i];
- var nextPt = pts[i + 1];
-
- if (point.lng >= Math.min(curPt.lng, nextPt.lng) && point.lng <= Math.max(curPt.lng, nextPt.lng) &&
- point.lat >= Math.min(curPt.lat, nextPt.lat) && point.lat <= Math.max(curPt.lat, nextPt.lat)) {
-
- var precision = (curPt.lng - point.lng) * (nextPt.lat - point.lat) - (nextPt.lng - point.lng) * (curPt.lat - point.lat);
- if (precision < 2e-10 && precision > -2e-10) {
- return true;
- }
- }
- }
- return false;
- }
-
-
- GeoUtils.isPointInPolygon = function (point, polygon) {
-
- if (!(point instanceof BMap.Point) ||
- !(polygon instanceof BMap.Polygon)) {
- return false;
- }
-
-
- var polygonBounds = polygon.getBounds();
- if (!this.isPointInRect(point, polygonBounds)) {
- return false;
- }
-
- var pts = polygon.getPath();
-
-
-
-
-
- var N = pts.length;
- var boundOrVertex = true;
- var intersectCount = 0;
- var precision = 2e-10;
- var p1, p2;
- var p = point;
-
- p1 = pts[0];
- for (var i = 1; i <= N; ++i) {
- if (p.equals(p1)) {
- return boundOrVertex;
- }
-
- p2 = pts[i % N];
- if (p.lat < Math.min(p1.lat, p2.lat) || p.lat > Math.max(p1.lat, p2.lat)) {
- p1 = p2;
- continue;
- }
- if (p.lat > Math.min(p1.lat, p2.lat) && p.lat < Math.max(p1.lat, p2.lat)) {
- if (p.lng <= Math.max(p1.lng, p2.lng)) {
- if (p1.lat == p2.lat && p.lng >= Math.min(p1.lng, p2.lng)) {
- return boundOrVertex;
- }
-
- if (p1.lng == p2.lng) {
-
-
- if (p1.lng == p.lng) {
- return boundOrVertex;
- } else {
- ++intersectCount;
- }
- } else {
-
-
- var xinters = (p.lat - p1.lat) * (p2.lng - p1.lng) / (p2.lat - p1.lat) + p1.lng;
-
-
- if (Math.abs(p.lng - xinters) < precision) {
- return boundOrVertex;
- }
-
- if (p.lng < xinters) {
- ++intersectCount;
- }
- }
- }
- } else {
- if (p.lat == p2.lat && p.lng <= p2.lng) {
- var p3 = pts[(i + 1) % N];
-
-
- if (p.lat >= Math.min(p1.lat, p3.lat) && p.lat <= Math.max(p1.lat, p3.lat)) {
- ++intersectCount;
- } else {
- intersectCount += 2;
- }
- }
- }
- p1 = p2;
- }
-
- if (intersectCount % 2 == 0) {
- return false;
- } else {
- return true;
- }
- }
-
-
- GeoUtils.degreeToRad = function (degree) {
- return Math.PI * degree / 180;
- }
-
-
- GeoUtils.radToDegree = function (rad) {
- return (180 * rad) / Math.PI;
- }
-
-
- function _getRange(v, a, b) {
- if (a != null) {
- v = Math.max(v, a);
- }
- if (b != null) {
- v = Math.min(v, b);
- }
- return v;
- }
-
-
- function _getLoop(v, a, b) {
- while (v > b) {
- v -= b - a
- }
- while (v < a) {
- v += b - a
- }
- return v;
- }
-
-
- GeoUtils.getDistance = function (point1, point2) {
-
- if (!(point1 instanceof BMap.Point) ||
- !(point2 instanceof BMap.Point)) {
- return 0;
- }
-
- point1.lng = _getLoop(point1.lng, -180, 180);
- point1.lat = _getRange(point1.lat, -74, 74);
- point2.lng = _getLoop(point2.lng, -180, 180);
- point2.lat = _getRange(point2.lat, -74, 74);
-
- var x1, x2, y1, y2;
- x1 = GeoUtils.degreeToRad(point1.lng);
- y1 = GeoUtils.degreeToRad(point1.lat);
- x2 = GeoUtils.degreeToRad(point2.lng);
- y2 = GeoUtils.degreeToRad(point2.lat);
-
- return EARTHRADIUS * Math.acos((Math.sin(y1) * Math.sin(y2) + Math.cos(y1) * Math.cos(y2) * Math.cos(x2 - x1)));
- }
-
-
- GeoUtils.getPolylineDistance = function (polyline) {
-
- if (polyline instanceof BMap.Polyline ||
- polyline instanceof Array) {
-
- var pts;
- if (polyline instanceof BMap.Polyline) {
- pts = polyline.getPath();
- } else {
- pts = polyline;
- }
-
- if (pts.length < 2) {
- return 0;
- }
-
-
- var totalDis = 0;
- for (var i = 0; i < pts.length - 1; i++) {
- var curPt = pts[i];
- var nextPt = pts[i + 1]
- var dis = GeoUtils.getDistance(curPt, nextPt);
- totalDis += dis;
- }
-
- return totalDis;
-
- } else {
- return 0;
- }
- }
-
-
- GeoUtils.getPolygonArea = function (polygon) {
-
- if (!(polygon instanceof BMap.Polygon) &&
- !(polygon instanceof Array)) {
- return 0;
- }
- var pts;
- if (polygon instanceof BMap.Polygon) {
- pts = polygon.getPath();
- } else {
- pts = polygon;
- }
-
- if (pts.length < 3) {
- return 0;
- }
-
- var totalArea = 0;
- var LowX = 0.0;
- var LowY = 0.0;
- var MiddleX = 0.0;
- var MiddleY = 0.0;
- var HighX = 0.0;
- var HighY = 0.0;
- var AM = 0.0;
- var BM = 0.0;
- var CM = 0.0;
- var AL = 0.0;
- var BL = 0.0;
- var CL = 0.0;
- var AH = 0.0;
- var BH = 0.0;
- var CH = 0.0;
- var CoefficientL = 0.0;
- var CoefficientH = 0.0;
- var ALtangent = 0.0;
- var BLtangent = 0.0;
- var CLtangent = 0.0;
- var AHtangent = 0.0;
- var BHtangent = 0.0;
- var CHtangent = 0.0;
- var ANormalLine = 0.0;
- var BNormalLine = 0.0;
- var CNormalLine = 0.0;
- var OrientationValue = 0.0;
- var AngleCos = 0.0;
- var Sum1 = 0.0;
- var Sum2 = 0.0;
- var Count2 = 0;
- var Count1 = 0;
- var Sum = 0.0;
- var Radius = EARTHRADIUS;
- var Count = pts.length;
- for (var i = 0; i < Count; i++) {
- if (i == 0) {
- LowX = pts[Count - 1].lng * Math.PI / 180;
- LowY = pts[Count - 1].lat * Math.PI / 180;
- MiddleX = pts[0].lng * Math.PI / 180;
- MiddleY = pts[0].lat * Math.PI / 180;
- HighX = pts[1].lng * Math.PI / 180;
- HighY = pts[1].lat * Math.PI / 180;
- }
- else if (i == Count - 1) {
- LowX = pts[Count - 2].lng * Math.PI / 180;
- LowY = pts[Count - 2].lat * Math.PI / 180;
- MiddleX = pts[Count - 1].lng * Math.PI / 180;
- MiddleY = pts[Count - 1].lat * Math.PI / 180;
- HighX = pts[0].lng * Math.PI / 180;
- HighY = pts[0].lat * Math.PI / 180;
- }
- else {
- LowX = pts[i - 1].lng * Math.PI / 180;
- LowY = pts[i - 1].lat * Math.PI / 180;
- MiddleX = pts[i].lng * Math.PI / 180;
- MiddleY = pts[i].lat * Math.PI / 180;
- HighX = pts[i + 1].lng * Math.PI / 180;
- HighY = pts[i + 1].lat * Math.PI / 180;
- }
- AM = Math.cos(MiddleY) * Math.cos(MiddleX);
- BM = Math.cos(MiddleY) * Math.sin(MiddleX);
- CM = Math.sin(MiddleY);
- AL = Math.cos(LowY) * Math.cos(LowX);
- BL = Math.cos(LowY) * Math.sin(LowX);
- CL = Math.sin(LowY);
- AH = Math.cos(HighY) * Math.cos(HighX);
- BH = Math.cos(HighY) * Math.sin(HighX);
- CH = Math.sin(HighY);
- CoefficientL = (AM * AM + BM * BM + CM * CM) / (AM * AL + BM * BL + CM * CL);
- CoefficientH = (AM * AM + BM * BM + CM * CM) / (AM * AH + BM * BH + CM * CH);
- ALtangent = CoefficientL * AL - AM;
- BLtangent = CoefficientL * BL - BM;
- CLtangent = CoefficientL * CL - CM;
- AHtangent = CoefficientH * AH - AM;
- BHtangent = CoefficientH * BH - BM;
- CHtangent = CoefficientH * CH - CM;
- AngleCos = (AHtangent * ALtangent + BHtangent * BLtangent + CHtangent * CLtangent) / (Math.sqrt(AHtangent * AHtangent + BHtangent * BHtangent + CHtangent * CHtangent) * Math.sqrt(ALtangent * ALtangent + BLtangent * BLtangent + CLtangent * CLtangent));
- AngleCos = Math.acos(AngleCos);
- ANormalLine = BHtangent * CLtangent - CHtangent * BLtangent;
- BNormalLine = 0 - (AHtangent * CLtangent - CHtangent * ALtangent);
- CNormalLine = AHtangent * BLtangent - BHtangent * ALtangent;
- if (AM != 0)
- OrientationValue = ANormalLine / AM;
- else if (BM != 0)
- OrientationValue = BNormalLine / BM;
- else
- OrientationValue = CNormalLine / CM;
- if (OrientationValue > 0) {
- Sum1 += AngleCos;
- Count1++;
- }
- else {
- Sum2 += AngleCos;
- Count2++;
- }
- }
- var tempSum1, tempSum2;
- tempSum1 = Sum1 + (2 * Math.PI * Count2 - Sum2);
- tempSum2 = (2 * Math.PI * Count1 - Sum1) + Sum2;
- if (Sum1 > Sum2) {
- if ((tempSum1 - (Count - 2) * Math.PI) < 1)
- Sum = tempSum1;
- else
- Sum = tempSum2;
- }
- else {
- if ((tempSum2 - (Count - 2) * Math.PI) < 1)
- Sum = tempSum2;
- else
- Sum = tempSum1;
- }
- totalArea = (Sum - (Count - 2) * Math.PI) * Radius * Radius;
- return totalArea;
- }
-
- })();
注意:
BMapLib.GeoUtils.getPolygonArea(polygon) 不适合计算自相交多边形的面积(封闭的面积)

百度地图API画多边型,测面积
原文:http://www.cnblogs.com/grimm/p/5097346.html