Supermap GIS地图知识点

Supermap GIS地图知识点

Supermap
GIS地图的一个周边查询功能，我这个是一个简单版的。

周边查询就是在地图上随机点一个点，然后查询这个点的周边。我这里实现的是随机点一个点，然后你可以输入一个半径，就是你想搜索的范围有多大，输入的半径越大搜索的范围越大，搜索的范围会以一个圆的方式来搜索。

 

操作有以下几个步骤：

首先获取到你所填写的半径、

然后获取到你所选择的点的一个X轴坐标和Y轴坐标、

然后就是画出一个圆形，这是一个搜索的形式

下面这个是画圆的代码

注释：这个画圆的代码是网上找的资料，直接加以引用

function createCircle(origin,radius,sides,r,angel) {

           //
queryByDistance(origin, radius);//热点渲染的最大半径radius,多边形的中心origin

            var rR
= r * Math.PI / (180 * sides);//边数sidex

            var
rotatedAngle, x, y;

            var
points = [];

            for
(var i = 0; i < sides; i++) {//用这个方法生成的圆是由内之外一个一个圆生成的

               
rotatedAngle = rR * i;

                x =
origin.x + (radius * Math.cos(rotatedAngle));

                y =
origin.y + (radius * Math.sin(rotatedAngle));

               
points.push(new SuperMap.Geometry.Point(x, y));

            }

           
rotatedAngle = r * Math.PI / 180;

            x =
origin.x + (radius * Math.cos(rotatedAngle));

            y =
origin.y + (radius * Math.sin(rotatedAngle));

           
points.push(new SuperMap.Geometry.Point(x, y));

            var
ring = new SuperMap.Geometry.LinearRing(points);

           
ring.rotate(parseFloat(angel), origin);

            var geo
= new SuperMap.Geometry.Collection([ring]);//ring环状图

           
geo.origin = origin;//中心

           
geo.radius = radius;//边数

            geo.r =
r;//半径

           
geo.angel = angel;//旋转角度

           
geo.sides = sides;//边数

           
geo.polygonType = "Curve";

           
console.log(geo);

            return
geo;//返

        }

然后就是给这个圆加上一点样式：

 

var circlep = createCircle(Point, BJid / 500000, 256,
360, 360);//createCircle画圆（这个画圆就是引用了上面的方法）

 

var circleVector = new
SuperMap.Feature.Vector(circlep);//获取计算后的值

       这个就是给圆加上一些样式，这些样式的官网有更详细的介绍：

               
circleVector.style = {//给圆加颜色

                   
strokeColor:"blue",//边框颜色

                   
fillColor: "blue",//面颜色

                   
strokeWidth: 2,//边框像素

                   
fillOpacity:0.3//填充不透明度

                }

               
vector.addFeatures(circleVector);

然后这个时候就可以查询以下这个圆范围内你所需要查询的内容，这个要看你自己要查什么了。