Question

我试图找出一旦将融合表层放入Google地图后删除所有出现的多边形线。

我知道在融合表方面可以通过将多边形边框宽度设置为0px进入“更改地图”和“更改要素样式”来实现此目的，但我该如何以编程方式执行此操作？

这是我一直在尝试的，stokeWeight：0不起作用，也没有strokeOpacity或者可见。

 var layer = new google.maps.FusionTablesLayer({
//suppressInfoWindows: true,
query: {
 select: "col2\x3e\x3e0",
 from: FusionTableID,
 where: ""
  },
    styles: [{
        polygonOptions: {
            strokeWeight: 0,
            strokeOpacity: 0,
            visible: 0
            }
        },{
        where: "impervious='A'",
        polygonOptions: {
            fillColor: '#e06666',
            fillOpacity: 0.75
            }
        },{
        where: "impervious='B'",
        polygonOptions: {
            fillColor: '#76a5af',
            fillOpacity: 0.75
            }
        },{
        where: "impervious='C'",
        polygonOptions: {
            fillColor: '#f6b26b',
            fillOpacity: 0.75
        }
      }]
});

Answer 1

将不透明度设置为真正小的非零数字。

layer = new google.maps.FusionTablesLayer({
    //suppressInfoWindows: true,
    map: map,
    query: {
        select: "kml_4326",
        from: FusionTableID,
        where: ""
    },
    styles: [{
        polygonOptions: {
            strokeWeight: 0,
            strokeOpacity: 0.00001,
            strokeColor: "#0000FF",
            fillColor: "#0000FF"
        }
    }, {
        where: "sov_a3='US1'",
        polygonOptions: {
            fillColor: '#e06666',
            fillOpacity: 0.75
        }
    }, {
        where: "sov_a3='CAN'",
        polygonOptions: {
            fillColor: '#76a5af',
            fillOpacity: 0.75
        }
    }, {
        where: "sov_a3='DN1'",
        polygonOptions: {
            fillColor: '#f6b26b',
            fillOpacity: 0.75
        }
    }]
});

proof of concept fiddle

代码段

var layer;
var map;

function initialize() {
  map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 2,
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      styles: [{
        "elementType": "geometry.stroke",
        "stylers": [{
          "visibility": "off"
        }]
      }]
    });
  // 1foc3xO9DyfSIF6ofvN0kp2bxSfSeKog5FbdWdQ
  var FusionTableID = "1foc3xO9DyfSIF6ofvN0kp2bxSfSeKog5FbdWdQ";
  layer = new google.maps.FusionTablesLayer({
    //suppressInfoWindows: true,
    map: map,
    query: {
      select: "kml_4326",
      from: FusionTableID,
      where: ""
    },
    styles: [{
      polygonOptions: {
        strokeWeight: 0,
        strokeOpacity: 0.00001,
        strokeColor: "#0000FF",
        fillColor: "#0000FF"
      }
    }, {
      where: "sov_a3='US1'",
      polygonOptions: {
        fillColor: '#e06666',
        fillOpacity: 0.75
      }
    }, {
      where: "sov_a3='CAN'",
      polygonOptions: {
        fillColor: '#76a5af',
        fillOpacity: 0.75
      }
    }, {
      where: "sov_a3='DN1'",
      polygonOptions: {
        fillColor: '#f6b26b',
        fillOpacity: 0.75
      }
    }]
  });


}
google.maps.event.addDomListener(window, "load", initialize);

html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<input type="button" onclick="if (layer.getMap()==null) {layer.setMap(map)} else {layer.setMap(null)}" value="toggle" />
<div id="map_canvas"></div>

以编程方式删除默认多边形线

1 个答案: