2011-01-27 15 views
0

こんにちは私はどのように他のすべてのコントロールを台無しにしないで、色の変更入力ボックスを削除しますか?入力ボックスを削除します

コードは、私が心配です少し下回っている

おかげでbuttonがしかその最後の関数内で参照されているように見える最後の行

function PolygonCreator(map) { 
    this.map = map; 
    this.pen = new Pen(this.map); 
    var thisOjb = this; 
    this.event = google.maps.event.addListener(thisOjb.map, 'click', function (event) { 
     thisOjb.pen.draw(event.latLng); 
    }); 
    this.showData = function() { 
     return this.pen.getData(); 
    } 
    this.showColor = function() { 
     return this.pen.getColor(); 
    } 
    this.destroy = function() { 
     this.pen.deleteMis(); 
     if (null != this.pen.polygon) { 
      this.pen.polygon.remove(); 
     } 
     google.maps.event.removeListener(this.event); 
    } 
} 

function Pen(map) { 
    this.map = map; 
    this.listOfDots = new Array(); 
    this.polyline = null; 
    this.polygon = null; 
    this.currentDot = null; 
    this.draw = function (latLng) { 
     if (null != this.polygon) { 
      alert('Click Reset to draw another'); 
     } else { 
      if (this.currentDot != null && this.listOfDots.length > 1 && this.currentDot == this.listOfDots[0]) { 
       this.drawPloygon(this.listOfDots); 
      } else { 
       if (null != this.polyline) { 
        this.polyline.remove(); 
       } 
       var dot = new Dot(latLng, this.map, this); 
       this.listOfDots.push(dot); 
       if (this.listOfDots.length > 1) { 
        this.polyline = new Line(this.listOfDots, this.map); 
       } 
      } 
     } 
    } 
    this.drawPloygon = function (listOfDots, color, des, id) { 
     this.polygon = new Polygon(listOfDots, this.map, this, color, des, id); 
     this.deleteMis(); 
    } 
    this.deleteMis = function() { 
     $.each(this.listOfDots, function (index, value) { 
      value.remove(); 
     }); 
     this.listOfDots.length = 0; 
     if (null != this.polyline) { 
      this.polyline.remove(); 
      this.polyline = null; 
     } 
    } 
    this.cancel = function() { 
     if (null != this.polygon) { 
      (this.polygon.remove()); 
     } 
     this.polygon = null; 
     this.deleteMis(); 
    } 
    this.setCurrentDot = function (dot) { 
     this.currentDot = dot; 
    } 
    this.getListOfDots = function() { 
     return this.listOfDots; 
    } 
    this.getData = function() { 
     if (this.polygon != null) { 
      var data = ""; 
      var paths = this.polygon.getPlots(); 
      paths.getAt(0).forEach(function (value, index) { 
       data += (value.toString()); 
      }); 
      return data; 
     } else { 
      return null; 
     } 
    } 
    this.getColor = function() { 
     if (this.polygon != null) { 
      var color = this.polygon.getColor(); 
      return color; 
     } else { 
      return null; 
     } 
    } 
} 

function Dot(latLng, map, pen) { 
    this.latLng = latLng; 
    this.parent = pen; 
    this.markerObj = new google.maps.Marker({ 
     position: this.latLng, 
     map: map 
    }); 
    this.addListener = function() { 
     var parent = this.parent; 
     var thisMarker = this.markerObj; 
     var thisDot = this; 
     google.maps.event.addListener(thisMarker, 'click', function() { 
      parent.setCurrentDot(thisDot); 
      parent.draw(thisMarker.getPosition()); 
     }); 
    } 
    this.addListener(); 
    this.getLatLng = function() { 
     return this.latLng; 
    } 
    this.getMarkerObj = function() { 
     return this.markerObj; 
    } 
    this.remove = function() { 
     this.markerObj.setMap(null); 
    } 
} 

function Line(listOfDots, map) { 
    this.listOfDots = listOfDots; 
    this.map = map; 
    this.coords = new Array(); 
    this.polylineObj = null; 
    if (this.listOfDots.length > 1) { 
     var thisObj = this; 
     $.each(this.listOfDots, function (index, value) { 
      thisObj.coords.push(value.getLatLng()); 
     }); 
     this.polylineObj = new google.maps.Polyline({ 
      path: this.coords, 
      strokeColor: "#3333FF", 
      strokeOpacity: 1.0, 
      strokeWeight: 2, 
      map: this.map 
     }); 
    } 
    this.remove = function() { 
     this.polylineObj.setMap(null); 
    } 
} 

function Polygon(listOfDots, map, pen, color) { 
    this.listOfDots = listOfDots; 
    this.map = map; 
    this.coords = new Array(); 
    this.parent = pen; 
    this.des = 'Hello'; 
    var thisObj = this; 
    $.each(this.listOfDots, function (index, value) { 
     thisObj.coords.push(value.getLatLng()); 
    }); 
    this.polygonObj = new google.maps.Polygon({ 
     paths: this.coords, 
     strokeColor: "#3333FF", 
     strokeOpacity: 0.8, 
     strokeWeight: 2, 
     fillColor: "#3333FF", 
     fillOpacity: 0.35, 
     map: this.map 
    }); 
    this.remove = function() { 
     this.info.remove(); 
     this.polygonObj.setMap(null); 
    } 
    this.getContent = function() { 
     return this.des; 
    } 
    this.getPolygonObj = function() { 
     return this.polygonObj; 
    } 
    this.getListOfDots = function() { 
     return this.listOfDots; 
    } 
    this.getPlots = function() { 
     return this.polygonObj.getPaths(); 
    } 
    this.getColor = function() { 
     return this.getPolygonObj().fillColor; 
    } 
    this.setColor = function (color) { 
     return this.getPolygonObj().setOptions({ 
      fillColor: color, 
      strokeColor: color, 
      strokeWeight: 2 
     }); 
    } 
    this.info = new Info(this, this.map); 
    this.addListener = function() { 
     var info = this.info; 
     var thisPolygon = this.polygonObj; 
     google.maps.event.addListener(thisPolygon, 'rightclick', function (event) { 
      info.show(event.latLng); 
     }); 
    } 
    this.addListener(); 
} 

function Info(polygon, map) { 
    this.parent = polygon; 
    this.map = map; 
    this.color = document.createElement('input'); 
    this.button = document.createElement('input'); 
    $(this.button).attr('type', 'button'); 
    $(this.button).val("Change Color"); 
    var thisOjb = this; 
    this.changeColor = function() { 
     thisOjb.parent.setColor($(thisOjb.color).val()); 
    } 
    this.getContent = function() { 
     var content = document.createElement('div'); 
     $(this.color).val(this.parent.getColor()); 
     $(this.button).click(function() { 
      thisObj.changeColor(); 
     }); 
     $(content).append(this.color); 
     $(content).append(this.button); 
     return content; 
    } 
    thisObj = this; 
    this.infoWidObj = new google.maps.InfoWindow({ 
     content: thisObj.getContent() 
    }); 
    this.show = function (latLng) { 
     this.infoWidObj.setPosition(latLng); 
     this.infoWidObj.open(this.map); 
    } 
    this.remove = function() { 
     this.infoWidObj.close(); 
    } 
} 
+0

ああ、このコードは恐ろしくフォーマットされているので、ひどく痛いです! – jzd

+0

うわー、私の画面はほとんど爆発した – jAndy

+0

私はごめんな人を知っている – user393273

答えて

1

であります、Info。だから私はそれを参照する関数内の5行(と同様にクリックハンドラの一部を形成する2つの余分な行)をコメントアウトすることは安全だと思います。

あなただけのユーザーがこのボタンを非表示にする場合は、あなただけのしたいことがあり、文字通り、Info.hide()、それが呼び出されます。これは最小限の介入となるでしょう。

$('input[value="Change Color"]').hide(); 
0
function PolygonCreator(map) { 
    this.map = map; 
    this.pen = new Pen(this.map); 
    var thisOjb = this; 
    this.event = google.maps.event.addListener(thisOjb.map, 'click', function (event) { 
     thisOjb.pen.draw(event.latLng); 
    }); 
    this.showData = function() { 
     return this.pen.getData(); 
    } 
    this.showColor = function() { 
     return this.pen.getColor(); 
    } 
    this.destroy = function() { 
     this.pen.deleteMis(); 
     if (null != this.pen.polygon) { 
      this.pen.polygon.remove(); 
     } 
     google.maps.event.removeListener(this.event); 
    } 
} 

function Pen(map) { 
    this.map = map; 
    this.listOfDots = new Array(); 
    this.polyline = null; 
    this.polygon = null; 
    this.currentDot = null; 
    this.draw = function (latLng) { 
     if (null != this.polygon) { 
      alert('Click Reset to draw another'); 
     } else { 
      if (this.currentDot != null && this.listOfDots.length > 1 && this.currentDot == this.listOfDots[0]) { 
       this.drawPloygon(this.listOfDots); 
      } else { 
       if (null != this.polyline) { 
        this.polyline.remove(); 
       } 
       var dot = new Dot(latLng, this.map, this); 
       this.listOfDots.push(dot); 
       if (this.listOfDots.length > 1) { 
        this.polyline = new Line(this.listOfDots, this.map); 
       } 
      } 
     } 
    } 
    this.drawPloygon = function (listOfDots, color, des, id) { 
     this.polygon = new Polygon(listOfDots, this.map, this, color, des, id); 
     this.deleteMis(); 
    } 
    this.deleteMis = function() { 
     $.each(this.listOfDots, function (index, value) { 
      value.remove(); 
     }); 
     this.listOfDots.length = 0; 
     if (null != this.polyline) { 
      this.polyline.remove(); 
      this.polyline = null; 
     } 
    } 
    this.cancel = function() { 
     if (null != this.polygon) { 
      (this.polygon.remove()); 
     } 
     this.polygon = null; 
     this.deleteMis(); 
    } 
    this.setCurrentDot = function (dot) { 
     this.currentDot = dot; 
    } 
    this.getListOfDots = function() { 
     return this.listOfDots; 
    } 
    this.getData = function() { 
     if (this.polygon != null) { 
      var data = ""; 
      var paths = this.polygon.getPlots(); 
      paths.getAt(0).forEach(function (value, index) { 
       data += (value.toString()); 
      }); 
      return data; 
     } else { 
      return null; 
     } 
    } 
    this.getColor = function() { 
     if (this.polygon != null) { 
      var color = this.polygon.getColor(); 
      return color; 
     } else { 
      return null; 
     } 
    } 
} 

function Dot(latLng, map, pen) { 
    this.latLng = latLng; 
    this.parent = pen; 
    this.markerObj = new google.maps.Marker({ 
     position: this.latLng, 
     map: map 
    }); 
    this.addListener = function() { 
     var parent = this.parent; 
     var thisMarker = this.markerObj; 
     var thisDot = this; 
     google.maps.event.addListener(thisMarker, 'click', function() { 
      parent.setCurrentDot(thisDot); 
      parent.draw(thisMarker.getPosition()); 
     }); 
    } 
    this.addListener(); 
    this.getLatLng = function() { 
     return this.latLng; 
    } 
    this.getMarkerObj = function() { 
     return this.markerObj; 
    } 
    this.remove = function() { 
     this.markerObj.setMap(null); 
    } 
} 

function Line(listOfDots, map) { 
    this.listOfDots = listOfDots; 
    this.map = map; 
    this.coords = new Array(); 
    this.polylineObj = null; 
    if (this.listOfDots.length > 1) { 
     var thisObj = this; 
     $.each(this.listOfDots, function (index, value) { 
      thisObj.coords.push(value.getLatLng()); 
     }); 
     this.polylineObj = new google.maps.Polyline({ 
      path: this.coords, 
      strokeColor: "#3333FF", 
      strokeOpacity: 1.0, 
      strokeWeight: 2, 
      map: this.map 
     }); 
    } 
    this.remove = function() { 
     this.polylineObj.setMap(null); 
    } 
} 

function Polygon(listOfDots, map, pen, color) { 
    this.listOfDots = listOfDots; 
    this.map = map; 
    this.coords = new Array(); 
    this.parent = pen; 
    this.des = 'Hello'; 
    var thisObj = this; 
    $.each(this.listOfDots, function (index, value) { 
     thisObj.coords.push(value.getLatLng()); 
    }); 
    this.polygonObj = new google.maps.Polygon({ 
     paths: this.coords, 
     strokeColor: "#3333FF", 
     strokeOpacity: 0.8, 
     strokeWeight: 2, 
     fillColor: "#3333FF", 
     fillOpacity: 0.35, 
     map: this.map 
    }); 
    this.remove = function() { 
     this.info.remove(); 
     this.polygonObj.setMap(null); 
    } 
    this.getContent = function() { 
     return this.des; 
    } 
    this.getPolygonObj = function() { 
     return this.polygonObj; 
    } 
    this.getListOfDots = function() { 
     return this.listOfDots; 
    } 
    this.getPlots = function() { 
     return this.polygonObj.getPaths(); 
    } 
    this.getColor = function() { 
     return this.getPolygonObj().fillColor; 
    } 
    this.setColor = function (color) { 
     return this.getPolygonObj().setOptions({ 
      fillColor: color, 
      strokeColor: color, 
      strokeWeight: 2 
     }); 
    } 
    this.info = new Info(this, this.map); 
    this.addListener = function() { 
     var info = this.info; 
     var thisPolygon = this.polygonObj; 
     //google.maps.event.addListener(thisPolygon, 'rightclick', function (event) { 
      // info.show(event.latLng); 
     //}); 
    } 
    this.addListener(); 
} 

function Info(polygon, map) { 
    this.parent = polygon; 
    this.map = map; 
    this.color = document.createElement('input'); 
    this.button = document.createElement('input'); 
    $(this.button).attr('type', 'button'); 
    $(this.button).val("Change Color"); 
    var thisOjb = this; 
    this.changeColor = function() { 
     thisOjb.parent.setColor($(thisOjb.color).val()); 
    } 
    this.getContent = function() { 
     var content = document.createElement('div'); 
     $(this.color).val(this.parent.getColor()); 
     //$(this.button).click(function() { 
      // thisObj.changeColor(); 
     // }); 
     $(content).append(this.color); 
     $(content).append(this.button); 
     return content; 
    } 
    thisObj = this; 
    this.infoWidObj = new google.maps.InfoWindow({ 
     content: thisObj.getContent() 
    }); 
    this.show = function (latLng) { 
     this.infoWidObj.setPosition(latLng); 
     this.infoWidObj.open(this.map); 
    } 
    this.remove = function() { 
     this.infoWidObj.close(); 
    } 
} 

固定

+0

これはフォーマットされたコードの権利ですか?それは答えではなくあなたの質問に対する編集でなければなりません。パトリックはあなたのためにあなたの質問を修正したので、この答えを削除してください。 – jzd

関連する問題