zl程序教程

您现在的位置是:首页 >  其它

当前栏目

leaflet geoman无法捕捉问题的解决

问题 解决 无法 捕捉 Leaflet
2023-06-13 09:15:16 时间

花了2天时间将mapus里的bug定位到。

每当画线或面域的时候,无法捕捉,并且出现错误提示,但无法定位。

原来的代码如下:

  // Render a new object
  async function renderShape(snapshot, key) {
    // var user = await checkAuth();
    // if (await checkAuth() != false) {
    if (snapshot.type == "draw" || snapshot.type == "line" || snapshot.type == "area") {
      if (objects.filter(function(result) {
          return result.id === key && result.user === snapshot.user
        }).length == 0) {
        // If the shape doesn't exist locally, create it
        var line = L.polyline([
          [snapshot.initlat, snapshot.initlng]
        ], {
          color: snapshot.color,
          // pmIgnore: false
        });
        if (snapshot.completed && (snapshot.type == "line" || snapshot.type == "area")) {
          // If the shape is already finished, give it all its coordinates
          line = L.polyline(snapshot.path, {
            color: snapshot.color,
            // pmIgnore: false
          }); // 这里是否允许激活线段编辑
        }
        line.addTo(map); // 这里导致无法捕捉!!

修改后的代码如下

  // Render a new object
  async function renderShape(snapshot, key) {
    // var user = await checkAuth();
    // if (await checkAuth() != false) {
    if (snapshot.type == "draw" || snapshot.type == "line" || snapshot.type == "area") {
      if (objects.filter(function(result) {
          return result.id === key && result.user === snapshot.user
        }).length == 0) {
        // If the shape doesn't exist locally, create it
        if (snapshot.completed && (snapshot.type == "line" || snapshot.type == "area")) {
          // If the shape is already finished, give it all its coordinates
          line = L.polyline(snapshot.path, {
            color: snapshot.color,
            pmIgnore: false
          }); // 这里是否允许激活线段编辑
          line.addTo(map);// 放到这里就可以了。
        } else {
          var line = L.polyline([
            [snapshot.initlat, snapshot.initlng]
          ], {
            color: snapshot.color,
            pmIgnore: false
          });
        }

原因分析:因为从数据库里读取图元,用上面这个rendershape方法添加到页面上,但是有些多段线不具备completed时,也被添加到页面上,但看不见,我估计是一些错误的数据——比如画了一半的多段线,按了取消键,这个时候数据存到数据库里了,但是completed=false。按照上述修改后,只将满足completed=true的多段线加到页面上。