如何在Google Maps API中移除GeoJSON绘制多边形的轮廓并提高透明度？

嘿，我之前做项目的时候也碰到过一模一样的需求！其实map.data对象自带了样式定制的方法，你完全不用局限在加载GeoJSON的步骤里，只需要加几行代码就能搞定透明度调整和轮廓移除的问题～

直接上最实用的代码方案，你可以直接套用到现有逻辑里：

// 先设置好多边形的样式规则
map.data.setStyle({
  fillColor: '#4285F4', // 替换成你原本用的填充颜色，或者自定义新颜色
  fillOpacity: 0.3, // 调整透明度，数值范围0（完全透明）到1（完全不透明），按需修改
  strokeWeight: 0 // 把轮廓线宽度设为0，直接隐藏难看的轮廓
});

// 再加载你的GeoJSON文件，样式会自动应用到所有多边形上
map.data.loadGeoJson('google.json');

关键属性解释： #

• fillOpacity：专门控制多边形填充色的透明度，你可以慢慢调整数值，找到视觉效果最好的透明度比例。
• strokeWeight：轮廓线的宽度参数，设为0就会完全移除轮廓；之后如果想恢复轮廓，改回1或其他正数就行。

如果之后你需要给不同多边形设置差异化样式（比如根据GeoJSON里的自定义属性区分），还可以给setStyle()传一个函数，举个例子：

map.data.setStyle(function(feature) {
  // 假设你的GeoJSON里有个"category"属性，根据属性值设置不同透明度
  let opacity = feature.getProperty('category') === 'park' ? 0.2 : 0.4;
  return {
    fillOpacity: opacity,
    strokeWeight: 0
  };
});

这个方法完全兼容你现有的加载逻辑，不用改动loadGeoJson的代码，直接加样式设置就生效啦！

内容的提问来源于stack exchange，提问作者Random