JS高手进 多边形不规则的遮罩层 谁知道怎么做啊 有图

JavaScript014

JS高手进 多边形不规则的遮罩层 谁知道怎么做啊 有图,第1张

有很多方法!

这个是一张整的背景图。再在上面加标签划分区域!

每块是单独的读片,只是每个图片有透明背景部分!

不懂在问嘛。

Relax Blog

relax.cnblogs.com

如何判断一个指定的经纬度点是否落在一个多边形区域内?

百度MAP里面的JS代码

//点在多边形内

function ptInPolygon(){

var pts = []

var pt1 = new BMap.Point(116.395, 39.910)

var pt2 = new BMap.Point(116.394, 39.914)

var pt3 = new BMap.Point(116.403, 39.920)

var pt4 = new BMap.Point(116.402, 39.914)

var pt5 = new BMap.Point(116.410, 39.913)

pts.push(pt1)

pts.push(pt2)

pts.push(pt3)

pts.push(pt4)

pts.push(pt5)

var ply = new BMap.Polygon(pts)

var pt =new BMap.Point(116.400, 39.914)

var result = BMapLib.GeoUtils.isPointInPolygon(pt, ply)

if(result == true){

alert("点在多边形内")

} else {

alert("点在多边形外")

}

//演示:将面添加到地图上

map.clearOverlays()

var mkr = new BMap.Marker(pt)

map.addOverlay(mkr)

map.addOverlay(ply)

}

b.isPointInPolygon = function(o, l) {

if (! (o instanceof BMap.Point) || !(l instanceof BMap.Polygon)) {

return false

}

var k = l.getBounds()

if (!this.isPointInRect(o, k)) {

return false

}

var t = l.getPath()

var h = t.length

var n = true

var j = 0

var g = 2e-10

var s, q

var e = o

s = t[0]

for (var f = 1f <= h++f) {

if (e.equals(s)) {

return n

}

q = t[f % h]

if (e.lat <Math.min(s.lat, q.lat) || e.lat >Math.max(s.lat, q.lat)) {

s = q

continue

}

if (e.lat >Math.min(s.lat, q.lat) &&e.lat <Math.max(s.lat, q.lat)) {

if (e.lng <= Math.max(s.lng, q.lng)) {

if (s.lat == q.lat &&e.lng >= Math.min(s.lng, q.lng)) {

return n

}

if (s.lng == q.lng) {

if (s.lng == e.lng) {

return n

} else {++j

}

} else {

var r = (e.lat - s.lat) * (q.lng - s.lng) / (q.lat - s.lat) + s.lng

if (Math.abs(e.lng - r) <g) {

return n

}

if (e.lng <r) {++j

}

}

}

} else {

if (e.lat == q.lat &&e.lng <= q.lng) {

var m = t[(f + 1) % h]

if (e.lat >= Math.min(s.lat, m.lat) &&e.lat <= Math.max(s.lat, m.lat)) {++j

} else {

j += 2

}

}

}

s = q

}

if (j % 2 == 0) {

return false

} else {

return true

}

}

SuperMap.IS.Utility.js 里面找到的代码