简体   繁体   English

仅在bing map中显示多边形区域

[英]show polygon area only in bing map

I have polygon rectangle shape in bing map.. how can modify the code so only the area inside the polygon is showing... 我在bing map中有多边形矩形形状..如何修改代码以便只显示多边​​形内的区域...

here is the code: 这是代码:

        <script type="text/javascript" src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0"></script>

        <script type="text/javascript">

            function GetMap()
            {
                // Initialize the map
                var map = new Microsoft.Maps.Map(document.getElementById("mapDiv"),{credentials:"At7RkDItXU6kncQzZa8M9lFfMbzPgmulJYLkhYn5JMMZfHL86lNyFZvGWWngxaAP",
                                                 });

                // Create a polygon
                var vertices = new Array(new Microsoft.Maps.Location(20,-20), new Microsoft.Maps.Location(20,20), new Microsoft.Maps.Location(-20,20), new Microsoft.Maps.Location(-20,-20), new Microsoft.Maps.Location(20,-20));
                var polygoncolor = new Microsoft.Maps.Color(100,100,0,100);
                var polygon = new Microsoft.Maps.Polygon(vertices,{fillColor: polygoncolor, strokeColor: polygoncolor});

                // Add the polygon to the map
                map.entities.push(polygon);
            }

            </script>
        </head>
<body onload="GetMap();">
    <div id='mapDiv' style="position:relative; width:400px; height:400px;"></div>       
</body>

It can be considered as a mask on the control. 它可以被视为控件上的掩码。

Masking with inverted polygon 用倒置多边形掩蔽

The technique consists in creating a polygon out of the current bounding box and that will exclude the specific area. 该技术包括从当前边界框创建多边形,并且将排除特定区域。

Of course, this approach has its limitations and one would be that it will be hard to manage multiple advanced shape in this case. 当然,这种方法有其局限性,并且在这种情况下很难管理多个高级形状。

This has been explained by our fellow Alastair in this blog post and would be easily adapted so everything would run on the client side only with a global polygon and a 'hole' while using advanced shape module: 我们的Alastair在这篇博客文章中对此进行了解释,并且很容易进行调整,因此在使用高级形状模块时,所有内容都只在客户端运行,只有全局多边形和“洞”:

http://alastaira.wordpress.com/2012/11/28/masking-out-particular-areas-of-interest-on-bing-maps/ http://alastaira.wordpress.com/2012/11/28/masking-out-particular-areas-of-interest-on-bing-maps/

Bing地图由Alastair掩盖多边形

Self overlapping polygon One other solution would be to create a polygon on the current bounding box to draw a global polygon on top of all the visible area and then you add locations so the polygon loops only where you have your own area. 自重叠多边形另一种解决方案是在当前边界框上创建一个多边形,以在所有可见区域的顶部绘制全局多边形,然后添加位置,使多边形仅在您拥有自己的区域时循环。

By default, the fusion mode would result in an exclusion that will hide both polygons, you can have a look at a useful property in SVG but it could also has its limits depending on the browser. 默认情况下,融合模式会导致隐藏两个多边形的排除,您可以查看SVG中的有用属性,但它也可以根据浏览器进行限制。

I'm assuming you want to remove the border. 我假设你要删除边框。 If that is the case set the strokeThickness to 0 and don't borth setting the strokeColor 如果是这种情况,请将strokeThickness设置为0,并且不要设置strokeColor

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM