权声明:本文为博主原创文章,未经博主允许不得转载。

利用百度API(JavaScript 版)实现在地图上绘制任一多边形,并判断给定经纬度是否在多边形范围内。以及两点间的测距功能。

  1. 绘制多边形(蓝色),折线轨迹(红色)效果图:
  1. <img src="http://img.blog.csdn.net/20150915193750707?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />

判断点范围,测距:

html代码:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=gbk" />
  5. <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
  6. <style type="text/css">
  7. body, html{width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}
  8. #allmap {height:500px; width: 100%;}
  9. #control{width:100%;}
  10. </style>
  11. <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=iqgvSM0gddG4NkGXFlawVa6C"></script>
  12. <script type="text/javascript" src="GeoUtils.js"></script>
  13. <title>设置线、面可编辑</title>
  14. </head>
  15. <body>
  16. <div id="allmap"></div>
  17. <div id="control">
  18. <button onclick = "polyline.enableEditing();polygon.enableEditing();">开启线、面编辑功能</button>
  19. <button onclick = "polyline.disableEditing();polygon.disableEditing();">关闭线、面编辑功能</button>
  20. </div>
  21. </body>
  22. </html>
  23. <script type="text/javascript">
  24. // 百度地图API功能
  25. var map = new BMap.Map("allmap");
  26. map.centerAndZoom(new BMap.Point(106.613922,29.53832), 15);
  27. map.enableScrollWheelZoom();
  28. var polyline = new BMap.Polyline([
  29. new BMap.Point(106.612539,29.529602),
  30. new BMap.Point(106.607975,29.53177),
  31. new BMap.Point(106.610311,29.525862),
  32. new BMap.Point(106.60776,29.524008)
  33. ], {strokeColor:"red", strokeWeight:2, strokeOpacity:0.5});   //创建折线
  34. map.addOverlay(polyline);   //增加折线
  35. var polygon = new BMap.Polygon([
  36. new BMap.Point(106.607477,29.544864),
  37. new BMap.Point(106.613572,29.548324),
  38. new BMap.Point(106.619357,29.537421),
  39. new BMap.Point(106.612988,29.537079),
  40. new BMap.Point(106.615359,29.541143)
  41. ], {strokeColor:"blue", strokeWeight:2, strokeOpacity:0.5});  //创建多边形
  42. map.addOverlay(polygon);   //增加多边形
  43. var ppoint = new BMap.Point(106.613087,29.540485);
  44. var result=BMapLib.GeoUtils.isPointInPolygon(ppoint, polygon);
  45. alert("数字图书馆是否在多边形范围内:"+result);
  46. var ppoint1 = new BMap.Point(106.614986,29.539876);
  47. var result1=BMapLib.GeoUtils.isPointInPolygon(ppoint1, polygon);
  48. alert("乒乓球馆是否在多边形范围内:"+result1+"米");
  49. var distance =map.getDistance(ppoint, ppoint1);
  50. alert("The Distance is"+distance);
  51. </script>

第二步,添加GeoUtils.js文件,代码如下:

  1. /**
  2. * @fileoverview GeoUtils类提供若干几何算法,用来帮助用户判断点与矩形、
  3. * 圆形、多边形线、多边形面的关系,并提供计算折线长度和多边形的面积的公式。
  4. * 主入口类是<a href="symbols/BMapLib.GeoUtils.html">GeoUtils</a>,
  5. * 基于Baidu Map API 1.2。
  6. *
  7. * @author Baidu Map Api Group
  8. * @version 1.2
  9. */
  10. //BMapLib.GeoUtils.degreeToRad(Number)
  11. //将度转化为弧度
  12. //BMapLib.GeoUtils.getDistance(Point, Point)
  13. //计算两点之间的距离,两点坐标必须为经纬度
  14. //BMapLib.GeoUtils.getPolygonArea(polygon)
  15. //计算多边形面或点数组构建图形的面积,注意:坐标类型只能是经纬度,且不适合计算自相交多边形的面积(封闭的面积)
  16. //BMapLib.GeoUtils.getPolylineDistance(polyline)
  17. //计算折线或者点数组的长度
  18. //BMapLib.GeoUtils.isPointInCircle(point, circle)
  19. //判断点是否在圆形内
  20. //BMapLib.GeoUtils.isPointInPolygon(point, polygon)
  21. //判断点是否多边形内
  22. //BMapLib.GeoUtils.isPointInRect(point, bounds)
  23. //判断点是否在矩形内
  24. //BMapLib.GeoUtils.isPointOnPolyline(point, polyline)
  25. //判断点是否在折线上
  26. //BMapLib.GeoUtils.radToDegree(Number)
  27. //将弧度转化为度
  28. /**
  29. * @namespace BMap的所有library类均放在BMapLib命名空间下
  30. */
  31. var BMapLib = window.BMapLib = BMapLib || {};
  32. (function () {
  33. /**
  34. * 地球半径
  35. */
  36. var EARTHRADIUS = 6370996.81;
  37. /**
  38. * @exports GeoUtils as BMapLib.GeoUtils
  39. */
  40. var GeoUtils =
  41. /**
  42. * GeoUtils类,静态类,勿需实例化即可使用
  43. * @class GeoUtils类的<b>入口</b>。
  44. * 该类提供的都是静态方法,勿需实例化即可使用。
  45. */
  46. BMapLib.GeoUtils = function () {
  47. }
  48. /**
  49. * 判断点是否在矩形内
  50. * @param {Point} point 点对象
  51. * @param {Bounds} bounds 矩形边界对象
  52. * @returns {Boolean} 点在矩形内返回true,否则返回false
  53. */
  54. GeoUtils.isPointInRect = function (point, bounds) {
  55. //检查类型是否正确
  56. if (!(point instanceof BMap.Point) ||
  57. !(bounds instanceof BMap.Bounds)) {
  58. return false;
  59. }
  60. var sw = bounds.getSouthWest(); //西南脚点
  61. var ne = bounds.getNorthEast(); //东北脚点
  62. return (point.lng >= sw.lng && point.lng <= ne.lng && point.lat >= sw.lat && point.lat <= ne.lat);
  63. }
  64. /**
  65. * 判断点是否在圆形内
  66. * @param {Point} point 点对象
  67. * @param {Circle} circle 圆形对象
  68. * @returns {Boolean} 点在圆形内返回true,否则返回false
  69. */
  70. GeoUtils.isPointInCircle = function (point, circle) {
  71. //检查类型是否正确
  72. if (!(point instanceof BMap.Point) ||
  73. !(circle instanceof BMap.Circle)) {
  74. return false;
  75. }
  76. //point与圆心距离小于圆形半径,则点在圆内,否则在圆外
  77. var c = circle.getCenter();
  78. var r = circle.getRadius();
  79. var dis = GeoUtils.getDistance(point, c);
  80. if (dis <= r) {
  81. return true;
  82. } else {
  83. return false;
  84. }
  85. }
  86. /**
  87. * 判断点是否在折线上
  88. * @param {Point} point 点对象
  89. * @param {Polyline} polyline 折线对象
  90. * @returns {Boolean} 点在折线上返回true,否则返回false
  91. */
  92. GeoUtils.isPointOnPolyline = function (point, polyline) {
  93. //检查类型
  94. if (!(point instanceof BMap.Point) ||
  95. !(polyline instanceof BMap.Polyline)) {
  96. return false;
  97. }
  98. //首先判断点是否在线的外包矩形内,如果在,则进一步判断,否则返回false
  99. var lineBounds = polyline.getBounds();
  100. if (!this.isPointInRect(point, lineBounds)) {
  101. return false;
  102. }
  103. //判断点是否在线段上,设点为Q,线段为P1P2 ,
  104. //判断点Q在该线段上的依据是:( Q - P1 ) × ( P2 - P1 ) = 0,且 Q 在以 P1,P2为对角顶点的矩形内
  105. var pts = polyline.getPath();
  106. for (var i = 0; i < pts.length - 1; i++) {
  107. var curPt = pts[i];
  108. var nextPt = pts[i + 1];
  109. //首先判断point是否在curPt和nextPt之间,即:此判断该点是否在该线段的外包矩形内
  110. if (point.lng >= Math.min(curPt.lng, nextPt.lng) && point.lng <= Math.max(curPt.lng, nextPt.lng) &&
  111. point.lat >= Math.min(curPt.lat, nextPt.lat) && point.lat <= Math.max(curPt.lat, nextPt.lat)) {
  112. //判断点是否在直线上公式
  113. var precision = (curPt.lng - point.lng) * (nextPt.lat - point.lat) - (nextPt.lng - point.lng) * (curPt.lat - point.lat);
  114. if (precision < 2e-10 && precision > -2e-10) {//实质判断是否接近0
  115. return true;
  116. }
  117. }
  118. }
  119. return false;
  120. }
  121. /**
  122. * 判断点是否多边形内
  123. * @param {Point} point 点对象
  124. * @param {Polyline} polygon 多边形对象
  125. * @returns {Boolean} 点在多边形内返回true,否则返回false
  126. */
  127. GeoUtils.isPointInPolygon = function (point, polygon) {
  128. //检查类型
  129. if (!(point instanceof BMap.Point) ||
  130. !(polygon instanceof BMap.Polygon)) {
  131. return false;
  132. }
  133. //首先判断点是否在多边形的外包矩形内,如果在,则进一步判断,否则返回false
  134. var polygonBounds = polygon.getBounds();
  135. if (!this.isPointInRect(point, polygonBounds)) {
  136. return false;
  137. }
  138. var pts = polygon.getPath(); //获取多边形点
  139. //下述代码来源:http://paulbourke.net/geometry/insidepoly/,进行了部分修改
  140. //基本思想是利用射线法,计算射线与多边形各边的交点,如果是偶数,则点在多边形外,否则
  141. //在多边形内。还会考虑一些特殊情况,如点在多边形顶点上,点在多边形边上等特殊情况。
  142. var N = pts.length;
  143. var boundOrVertex = true; //如果点位于多边形的顶点或边上,也算做点在多边形内,直接返回true
  144. var intersectCount = 0; //cross points count of x
  145. var precision = 2e-10; //浮点类型计算时候与0比较时候的容差
  146. var p1, p2; //neighbour bound vertices
  147. var p = point; //测试点
  148. p1 = pts[0]; //left vertex
  149. for (var i = 1; i <= N; ++i) {//check all rays
  150. if (p.equals(p1)) {
  151. return boundOrVertex; //p is an vertex
  152. }
  153. p2 = pts[i % N]; //right vertex
  154. if (p.lat < Math.min(p1.lat, p2.lat) || p.lat > Math.max(p1.lat, p2.lat)) {//ray is outside of our interests
  155. p1 = p2;
  156. continue; //next ray left point
  157. }
  158. if (p.lat > Math.min(p1.lat, p2.lat) && p.lat < Math.max(p1.lat, p2.lat)) {//ray is crossing over by the algorithm (common part of)
  159. if (p.lng <= Math.max(p1.lng, p2.lng)) {//x is before of ray
  160. if (p1.lat == p2.lat && p.lng >= Math.min(p1.lng, p2.lng)) {//overlies on a horizontal ray
  161. return boundOrVertex;
  162. }
  163. if (p1.lng == p2.lng) {//ray is vertical
  164. if (p1.lng == p.lng) {//overlies on a vertical ray
  165. return boundOrVertex;
  166. } else {//before ray
  167. ++intersectCount;
  168. }
  169. } else {//cross point on the left side
  170. var xinters = (p.lat - p1.lat) * (p2.lng - p1.lng) / (p2.lat - p1.lat) + p1.lng; //cross point of lng
  171. if (Math.abs(p.lng - xinters) < precision) {//overlies on a ray
  172. return boundOrVertex;
  173. }
  174. if (p.lng < xinters) {//before ray
  175. ++intersectCount;
  176. }
  177. }
  178. }
  179. } else {//special case when ray is crossing through the vertex
  180. if (p.lat == p2.lat && p.lng <= p2.lng) {//p crossing over p2
  181. var p3 = pts[(i + 1) % N]; //next vertex
  182. if (p.lat >= Math.min(p1.lat, p3.lat) && p.lat <= Math.max(p1.lat, p3.lat)) {//p.lat lies between p1.lat & p3.lat
  183. ++intersectCount;
  184. } else {
  185. intersectCount += 2;
  186. }
  187. }
  188. }
  189. p1 = p2; //next ray left point
  190. }
  191. if (intersectCount % 2 == 0) {//偶数在多边形外
  192. return false;
  193. } else { //奇数在多边形内
  194. return true;
  195. }
  196. }
  197. /**
  198. * 将度转化为弧度
  199. * @param {degree} Number 度
  200. * @returns {Number} 弧度
  201. */
  202. GeoUtils.degreeToRad = function (degree) {
  203. return Math.PI * degree / 180;
  204. }
  205. /**
  206. * 将弧度转化为度
  207. * @param {radian} Number 弧度
  208. * @returns {Number} 度
  209. */
  210. GeoUtils.radToDegree = function (rad) {
  211. return (180 * rad) / Math.PI;
  212. }
  213. /**
  214. * 将v值限定在a,b之间,纬度使用
  215. */
  216. function _getRange(v, a, b) {
  217. if (a != null) {
  218. v = Math.max(v, a);
  219. }
  220. if (b != null) {
  221. v = Math.min(v, b);
  222. }
  223. return v;
  224. }
  225. /**
  226. * 将v值限定在a,b之间,经度使用
  227. */
  228. function _getLoop(v, a, b) {
  229. while (v > b) {
  230. v -= b - a
  231. }
  232. while (v < a) {
  233. v += b - a
  234. }
  235. return v;
  236. }
  237. /**
  238. * 计算两点之间的距离,两点坐标必须为经纬度
  239. * @param {point1} Point 点对象
  240. * @param {point2} Point 点对象
  241. * @returns {Number} 两点之间距离,单位为米
  242. */
  243. GeoUtils.getDistance = function (point1, point2) {
  244. //判断类型
  245. if (!(point1 instanceof BMap.Point) ||
  246. !(point2 instanceof BMap.Point)) {
  247. return 0;
  248. }
  249. point1.lng = _getLoop(point1.lng, -180, 180);
  250. point1.lat = _getRange(point1.lat, -74, 74);
  251. point2.lng = _getLoop(point2.lng, -180, 180);
  252. point2.lat = _getRange(point2.lat, -74, 74);
  253. var x1, x2, y1, y2;
  254. x1 = GeoUtils.degreeToRad(point1.lng);
  255. y1 = GeoUtils.degreeToRad(point1.lat);
  256. x2 = GeoUtils.degreeToRad(point2.lng);
  257. y2 = GeoUtils.degreeToRad(point2.lat);
  258. return EARTHRADIUS * Math.acos((Math.sin(y1) * Math.sin(y2) + Math.cos(y1) * Math.cos(y2) * Math.cos(x2 - x1)));
  259. }
  260. /**
  261. * 计算折线或者点数组的长度
  262. * @param {Polyline|Array<Point>} polyline 折线对象或者点数组
  263. * @returns {Number} 折线或点数组对应的长度
  264. */
  265. GeoUtils.getPolylineDistance = function (polyline) {
  266. //检查类型
  267. if (polyline instanceof BMap.Polyline ||
  268. polyline instanceof Array) {
  269. //将polyline统一为数组
  270. var pts;
  271. if (polyline instanceof BMap.Polyline) {
  272. pts = polyline.getPath();
  273. } else {
  274. pts = polyline;
  275. }
  276. if (pts.length < 2) {//小于2个点,返回0
  277. return 0;
  278. }
  279. //遍历所有线段将其相加,计算整条线段的长度
  280. var totalDis = 0;
  281. for (var i = 0; i < pts.length - 1; i++) {
  282. var curPt = pts[i];
  283. var nextPt = pts[i + 1]
  284. var dis = GeoUtils.getDistance(curPt, nextPt);
  285. totalDis += dis;
  286. }
  287. return totalDis;
  288. } else {
  289. return 0;
  290. }
  291. }
  292. /**
  293. * 计算多边形面或点数组构建图形的面积,注意:坐标类型只能是经纬
  294. 度,且不适合计算自相交多边形的面积
  295. * @param {Polygon|Array<Point>} polygon 多边形面对象或者点数
  296. * @returns {Number} 多边形面或点数组构成图形的面积
  297. */
  298. GeoUtils.getPolygonArea = function (polygon) {
  299. //检查类型
  300. if (!(polygon instanceof BMap.Polygon) &&
  301. !(polygon instanceof Array)) {
  302. return 0;
  303. }
  304. var pts;
  305. if (polygon instanceof BMap.Polygon) {
  306. pts = polygon.getPath();
  307. } else {
  308. pts = polygon;
  309. }
  310. if (pts.length < 3) {//小于3个顶点,不能构建面
  311. return 0;
  312. }
  313. var totalArea = 0; //初始化总面积
  314. var LowX = 0.0;
  315. var LowY = 0.0;
  316. var MiddleX = 0.0;
  317. var MiddleY = 0.0;
  318. var HighX = 0.0;
  319. var HighY = 0.0;
  320. var AM = 0.0;
  321. var BM = 0.0;
  322. var CM = 0.0;
  323. var AL = 0.0;
  324. var BL = 0.0;
  325. var CL = 0.0;
  326. var AH = 0.0;
  327. var BH = 0.0;
  328. var CH = 0.0;
  329. var CoefficientL = 0.0;
  330. var CoefficientH = 0.0;
  331. var ALtangent = 0.0;
  332. var BLtangent = 0.0;
  333. var CLtangent = 0.0;
  334. var AHtangent = 0.0;
  335. var BHtangent = 0.0;
  336. var CHtangent = 0.0;
  337. var ANormalLine = 0.0;
  338. var BNormalLine = 0.0;
  339. var CNormalLine = 0.0;
  340. var OrientationValue = 0.0;
  341. var AngleCos = 0.0;
  342. var Sum1 = 0.0;
  343. var Sum2 = 0.0;
  344. var Count2 = 0;
  345. var Count1 = 0;
  346. var Sum = 0.0;
  347. var Radius = EARTHRADIUS; //6378137.0,WGS84椭球半径
  348. var Count = pts.length;
  349. for (var i = 0; i < Count; i++) {
  350. if (i == 0) {
  351. LowX = pts[Count - 1].lng * Math.PI / 180;
  352. LowY = pts[Count - 1].lat * Math.PI / 180;
  353. MiddleX = pts[0].lng * Math.PI / 180;
  354. MiddleY = pts[0].lat * Math.PI / 180;
  355. HighX = pts[1].lng * Math.PI / 180;
  356. HighY = pts[1].lat * Math.PI / 180;
  357. }
  358. else if (i == Count - 1) {
  359. LowX = pts[Count - 2].lng * Math.PI / 180;
  360. LowY = pts[Count - 2].lat * Math.PI / 180;
  361. MiddleX = pts[Count - 1].lng * Math.PI / 180;
  362. MiddleY = pts[Count - 1].lat * Math.PI / 180;
  363. HighX = pts[0].lng * Math.PI / 180;
  364. HighY = pts[0].lat * Math.PI / 180;
  365. }
  366. else {
  367. LowX = pts[i - 1].lng * Math.PI / 180;
  368. LowY = pts[i - 1].lat * Math.PI / 180;
  369. MiddleX = pts[i].lng * Math.PI / 180;
  370. MiddleY = pts[i].lat * Math.PI / 180;
  371. HighX = pts[i + 1].lng * Math.PI / 180;
  372. HighY = pts[i + 1].lat * Math.PI / 180;
  373. }
  374. AM = Math.cos(MiddleY) * Math.cos(MiddleX);
  375. BM = Math.cos(MiddleY) * Math.sin(MiddleX);
  376. CM = Math.sin(MiddleY);
  377. AL = Math.cos(LowY) * Math.cos(LowX);
  378. BL = Math.cos(LowY) * Math.sin(LowX);
  379. CL = Math.sin(LowY);
  380. AH = Math.cos(HighY) * Math.cos(HighX);
  381. BH = Math.cos(HighY) * Math.sin(HighX);
  382. CH = Math.sin(HighY);
  383. CoefficientL = (AM * AM + BM * BM + CM * CM) / (AM * AL + BM * BL + CM * CL);
  384. CoefficientH = (AM * AM + BM * BM + CM * CM) / (AM * AH + BM * BH + CM * CH);
  385. ALtangent = CoefficientL * AL - AM;
  386. BLtangent = CoefficientL * BL - BM;
  387. CLtangent = CoefficientL * CL - CM;
  388. AHtangent = CoefficientH * AH - AM;
  389. BHtangent = CoefficientH * BH - BM;
  390. CHtangent = CoefficientH * CH - CM;
  391. AngleCos = (AHtangent * ALtangent + BHtangent * BLtangent + CHtangent * CLtangent) / (Math.sqrt(AHtangent * AHtangent + BHtangent * BHtangent + CHtangent * CHtangent) * Math.sqrt(ALtangent * ALtangent + BLtangent * BLtangent + CLtangent * CLtangent));
  392. AngleCos = Math.acos(AngleCos);
  393. ANormalLine = BHtangent * CLtangent - CHtangent * BLtangent;
  394. BNormalLine = 0 - (AHtangent * CLtangent - CHtangent * ALtangent);
  395. CNormalLine = AHtangent * BLtangent - BHtangent * ALtangent;
  396. if (AM != 0)
  397. OrientationValue = ANormalLine / AM;
  398. else if (BM != 0)
  399. OrientationValue = BNormalLine / BM;
  400. else
  401. OrientationValue = CNormalLine / CM;
  402. if (OrientationValue > 0) {
  403. Sum1 += AngleCos;
  404. Count1++;
  405. }
  406. else {
  407. Sum2 += AngleCos;
  408. Count2++;
  409. }
  410. }
  411. var tempSum1, tempSum2;
  412. tempSum1 = Sum1 + (2 * Math.PI * Count2 - Sum2);
  413. tempSum2 = (2 * Math.PI * Count1 - Sum1) + Sum2;
  414. if (Sum1 > Sum2) {
  415. if ((tempSum1 - (Count - 2) * Math.PI) < 1)
  416. Sum = tempSum1;
  417. else
  418. Sum = tempSum2;
  419. }
  420. else {
  421. if ((tempSum2 - (Count - 2) * Math.PI) < 1)
  422. Sum = tempSum2;
  423. else
  424. Sum = tempSum1;
  425. }
  426. totalArea = (Sum - (Count - 2) * Math.PI) * Radius * Radius;
  427. return totalArea; //返回总面积
  428. }
 

利用百度API(JavaScript 版)实现在地图上绘制任一多边形,并判断给定经纬度是否在多边形范围内。以及两点间的测距功能的更多相关文章

  1. 记录开发基于百度地图API实现在地图上绘制轨迹并拾取轨迹对应经纬度的工具说明

    前言: 最近一直在做数据可视化方面的工作,其中平面可视化没什么难度,毕竟已经有很多成熟的可供使用的框架,比如百度的echart.js,highcharts.js等.还有就是3D可视化了,整体来说难度也 ...

  2. 利用百度API Store接口进行火车票查询

    火车票查询 项目源码下载链接: Github:https://github.com/VincentWYJ/TrainTicketQuery 博客文件:http://files.cnblogs.com/ ...

  3. 在谷歌地图上绘制行政区域轮廓【结合高德地图的API】

    实现思路: 1.利用高德地图行政区域API获得坐标列表 2.将坐标列表绘制在谷歌地图上[因为高德地图和国内的谷歌地图都是采用GCJ02坐标系,所有误差很小,可以不进行坐标误差转换] 注意点: 1.用百 ...

  4. ArcGIS API for Silverlight 实现修改地图上的工程点位置

    原文:ArcGIS API for Silverlight 实现修改地图上的工程点位置 #region 处理工程点点击编辑相关事件 public Graphic editgraphics = null ...

  5. iOS开发之在地图上绘制出你运行的轨迹

    首先我们看下如何在地图上绘制曲线.在Map Kit中提供了一个叫MKPolyline的类,我们可以利用它来绘制曲线,先看个简单的例子. 使用下面代码从一个文件中读取出经纬度,然后创建一个路径:MKPo ...

  6. R语言绘图:在地图上绘制热力图

    使用ggplot2在地图上绘制热力图 ######*****绘制热力图代码*****####### interval <- seq(0, 150000, 25000)[-2] #设置价格区间 n ...

  7. R语言绘图:在地图上绘制散点图

    使用ggplot2在地图上绘制散点图 ######*****绘制散点图代码*****####### options(baidumap.key = '**************') #设置密钥 bei ...

  8. echarts在地图上绘制散点图(任意点)

    项目需求:在省份地图上绘制散点图,散点位置不一定是哪个城市或哪个区县,即任意点 通过查询官网文档,找到一个与需求类似的Demo:https://www.echartsjs.com/gallery/ed ...

  9. ArcGIS api for javascript——查找任务-在地图上查找要素

    描述 本例展示了如何使用查找任务搜索数据.本例在地图上用图表显示结果并用DojoX的grid格式化结果为表格样式. FindTask构造函数需要一个ArcGIS Server地图服务的URL.本例使用 ...

随机推荐

  1. JVM运行时数据区和垃圾回收机制

    最近参考各种资料,尤其是<深入理解Java虚拟机 JVM高级特性和最佳实践>,大牛之作.把最近学习的Java虚拟机组成和垃圾回收机制总结一下. 你不会的都是新知识,学无止境,每天进步一点点 ...

  2. EasyPusher/EasyDarwin支持H.265 RTSP/RTP直播推流与分发播放

    前言描述 随着大屏时代和高清时代的到来,人们已经不再满足于VGA.CIF这种小分辨率了,取而代之的是720P.1080P.4K级的视频传输,虽然我们国家的基础带宽一直在上升,但普遍情况下,传输高清视频 ...

  3. Echart--百度地图(散点图)

    参考:http://blog.csdn.net/xieweikun7/article/details/52766676 1.首先,下载嘛 Echarts http://echarts.baidu.co ...

  4. 快速生成树RTSP

    Note: 数据分组:

  5. keras channels_last、preprocess_input、全连接层Dense、SGD优化器、模型及编译

    channels_last 和 channels_first keras中 channels_last 和 channels_first 用来设定数据的维度顺序(image_data_format). ...

  6. xshell连接及优化

    xshell 连接 问题:当你的xshell与服务器连接不上时 1:可先排查道路通不通 正常: 不正常: 1:查看服务器ip正不正确 2:vmware 编辑-虚拟网络编辑器 3:windows服务  ...

  7. scrapy与scrapyd安装

    Scrapy是用python编写的爬虫程序. Scrapyd是一个部署与运行scrapy爬虫的应用,提供JSON API的调用方式来部署与控制爬虫 . 本文验证在fedora与centos是安装成功. ...

  8. HihoCoder 1044 垃圾清理 (优化:状态压缩)

    状态压缩·一 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 小Hi和小Ho在兑换到了喜欢的奖品之后,便继续起了他们的美国之行,思来想去,他们决定乘坐火车前往下一座城市— ...

  9. flask第十八篇——模板【2】

    请关注公众号:自动化测试实战 上一节我们介绍了模板的基本使用方法,现在我们想一个问题,如果把index.html放到template文件夹下面的文件夹该怎么办呢?其实很容易,当文件夹结构如下图所示时: ...

  10. php中strstr、strchr、strrchr、substr、stristr

    一.strstr 和 strcchr的区别 strstr   显示第一次找到,要查找的字符串,以及后面的字符串. strrchr 显示最后一次找到,要查找的字符串,以及后面的字符串. 二.strstr ...