Javascript 将传单图例放置在地图分区之外

我刚刚完成地图图例的绘制，但现在我想将图例放置在传单地图的外部

我在index.html中有两个div：一个ID为“map”，另一个ID为“legend”

var legend=newl.control（{position:'topright'}）；
legend.onAdd=函数（映射）{
var div=L.DomUtil.create（'div'，'info legend'）；
类别=[‘麦当劳’、‘地铁’、‘肯德基’、‘汉堡王’、‘多米诺骨牌’、‘纽约披萨’、‘夸利塔里亚’、‘奥维格’]；
对于（变量i=0；i'：'+'）；
}
返回div；
};
$.when（$.ajax（initialize（）））。然后（function（）{
图例。添加到（地图）；
});

---

是否可以将图例的位置从“map”div更改为另一个div？如果可以，如何更改？

当您执行

legend.addTo（map）

时，如果将

map

更改为另一个div会发生什么？我已经尝试过了，但唯一发生的事情是图例消失了。如果我运行Firebug，我会收到以下错误消息：TypeError:map.\u controlCorners是undefinedHmm。可能是您的

map

变量未定义。你能把你的代码放在一个文件夹中吗？我以前没有使用过JSFIDLE，所以我希望你能使用它<代码>地图确实没有定义，我以前没有看到这个图例。我用最后3行代码解决了这个问题。是的，我也用本地数据库处理我的数据。将图例上移到

initialize（）

中修复了我以前遇到的一个错误。不再需要最后几行了，谢谢。

var legend = new L.control({position: 'topright'});

legend.onAdd = function (map) {
    var div = L.DomUtil.create('div', 'info legend');
    categories = ['MacDonalds', 'Subway', 'KFC', 'BurgerKing', 'Dominos', 'NYPizza', 'Kwalitaria', 'overig'];

    for (var i = 0; i < categories.length; i++) {
        div.innerHTML += '<i style="background:' + getColor(categories[i]) + '"></i> ' + (categories[i] ? categories[i] + '<br>' : '+');
    }

    return div;
};

$.when($.ajax(initialize())).then(function () {

    legend.addTo(map);

});