javascript - Leaflet.JS 试图扩展 Circle 类
问题描述
代码:
var map = L.map("map").setView([51.505, -0.09], 13);
L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
attribution:
'© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
}).addTo(map);
var polygon = L.polygon([
[54.069122, -4.769456],
[54.069223, -4.768973],
[54.069465, -4.769123],
[54.069368, -4.769606],
]).addTo(map);
var DraggableCircle = L.Circle.extend({
initialize: function (name, options) {
this.name = name;
L.setOptions(this, options);
this.setRadius(2);
this.setLatLng([54.069223, -4.768973]);
this.on({
mousedown: function () {
map.on("mousemove", this.moveObject);
},
click: function () {
map.off("mousemove", this.moveObject);
map.dragging.enable();
},
});
this.addTo(map);
},
moveObject: function (event) {
L.Circle.prototype.setLatLng.call(this, event.latlng);
map.dragging.disable();
},
});
var testCircle = new DraggableCircle("Draggable", {
color: "red",
fillColor: "#f03",
fillOpacity: 1,
interactive: true,
});
我正在尝试扩展 Leaflet.JS Circle 类来制作我自己的可拖动圆形对象类。在大多数情况下,我能够创建构造函数并正确使用 .extend() 方法。但是,当我定义我的 moveObject 方法时,它在鼠标移动时设置圆的纬度和经度,浏览器控制台说 redraw() 方法是未定义的。我不确定为什么会发生这种情况,如果有人可以帮助我解释 JavaScript 面向原型意味着什么,我将不胜感激。
这是我的错误: