Question

我知道目前无法动态更改地图范围。

所以我试图：

创建地图发生了一些事件然后我废弃地图并绘制一个新的细节，包括新的投影。

问题是我无法正确废弃旧地图。我试图获取map变量，在svg属性上调用remove（），使用＆＃34; delete svg＆＃34;出于性能目的，然后去解构对象。然后将map变量重新分配给函数A的结果，其中函数A只是设置一个新映射。

创建新地图的功能：

function createMap (latlon){
var basicMap = new Datamap({
  element: document.getElementById("basic"),
    setProjection: function(element) {
var projection = d3.geo.equirectangular()
  .center(latlon)
  .rotate([0, 0])
  .scale(1200)
  .translate([element.offsetWidth / 2, element.offsetHeight / 2]);
var path = d3.geo.path()
  .projection(projection);

return {path: path, projection: projection};
},
  projection: "mercator",
  scope: 'world',
   fills: {
        defaultFill: "#ABDDA4",
      },
  responsive: true,
    done: function(datamap){
        datamap.svg.call(d3.behavior.zoom().on("zoom", redraw));
        $("#resetZoom").on("click", function(){
   resetZoom();
})
        function redraw() {
            datamap.svg.selectAll("g").attr("transform", "translate(" + d3.event.translate + ")scale(" + d3.event.scale + ")");
        }
        function resetZoom() { datamap.svg.selectAll("g").attr("transform", "translate(0,0)scale(1.0)"); }
},
});
return basicMap
}

破坏功能：

function cleanUp(map){
map.svg.remove();
delete map.svg;
delete map;

}

我将地图初始化为basic，如下所示

basic = createMap([2,46]);

然后我清理地图（我的销毁功能）并重新分配：

cleanUp(basic);
basic = createMap([personLon, personLat])

从表面上看，它可以正常工作。而且性能还可以。但是，它并没有真正正常工作。例如，缩放功能不再起作用。当按下缩放按钮时，它正在寻找它不能再找到的地图变量。这没有意义，因为新地图为按钮等创建了新的点击处理程序。它几乎可以工作。

但这只是不起作用。有小费吗？感谢。

Answer 1

我有同样的问题并通过使用JQuery删除元素然后再次重新添加相同的元素来解决它。看起来有点像黑客，但它对我有用。

        $("#drilldown-map").parent().append( "<div id='drilldown-map' />");
        $("#drilldown-map").remove();

        var mapData = getMapData();
        var map = new Datamap(mapData);

Answer 2

这里有点晚了，但你可以简单地清空包含图表的父元素。因此，例如，可以通过运行<div id="chart"></div>并使用$('#chart').empty();重新初始化D3来重置chart = new Datamap({... element: document.getElementById('chart') ...})中初始化的图表

Answer 3

如果有人来这里寻找Angular1.5解决方案（基于上面的jquery答案），那么你可以使用E/AndroidRuntime: FATAL EXCEPTION: main Process: com.datumdroid.android.ocr.simple, PID: 2425 java.lang.UnsatisfiedLinkError: com.android.tools.fd.runtime.IncrementalClassLoader$DelegateClassLoader[DexPathList[[dex file "/data/data/com.datumdroid.android.ocr.simple/files/instant-run/dex/slice-slice_9-classes.dex", dex file "/data/data/com.datumdroid.android.ocr.simple/files/instant-run/dex/slice-slice_8-classes.dex", dex file "/data/data/com.datumdroid.android.ocr.simple/files/instant-run/dex/slice-slice_7-classes.dex", dex file "/data/data/com.datumdroid.android.ocr.simple/files/instant-run/dex/slice-slice_6-classes.dex", dex file "/data/data/com.datumdroid.android.ocr.simple/files/instant-run/dex/slice-slice_5-classes.dex", dex file "/data/data/com.datumdroid.android.ocr.simple/files/instant-run/dex/slice-slice_4-classes.dex", dex file "/data/data/com.datumdroid.android.ocr.simple/files/instant-run/dex/slice-slice_3-classes.dex", dex file "/data/data/com.datumdroid.android.ocr.simple/files/instant-run/dex/slice-slice_2-classes.dex", dex file "/data/data/com.datumdroid.android.ocr.simple/files/instant-run/dex/slice-slice_1-classes.dex", dex file "/data/data/com.datumdroid.android.ocr.simple/files/instant-run/dex/slice-slice_0-classes.dex"],nativeLibraryDirectories=[/data/app/com.datumdroid.android.ocr.simple-2/lib/x86, /system/lib, /vendor/lib]]] couldn't find "libjpgt.so" at java.lang.Runtime.loadLibrary0(Runtime.java:972) at java.lang.System.loadLibrary(System.java:1530) at com.googlecode.tesseract.android.TessBaseAPI.<clinit>(TessBaseAPI.java:44) at com.datumdroid.android.ocr.simple.SimpleAndroidOCRActivity.onPhotoTaken(SimpleAndroidOCRActivity.java:214) at com.datumdroid.android.ocr.simple.SimpleAndroidOCRActivity.onActivityResult(SimpleAndroidOCRActivity.java:138) at android.app.Activity.dispatchActivityResult(Activity.java:6915) at android.app.ActivityThread.deliverResults(ActivityThread.java:4049) at android.app.ActivityThread.handleSendResult(ActivityThread.java:4096) at android.app.ActivityThread.-wrap20(ActivityThread.java) at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1516) at android.os.Handler.dispatchMessage(Handler.java:102) at android.os.Looper.loop(Looper.java:154) at android.app.ActivityThread.main(ActivityThread.java:6077) at java.lang.reflect.Method.invoke(Native Method) at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:865) at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:755) Application terminated. （其中showMap为true或false）。如果删除地图，则为False，然后重置投影选项，然后再次将showMap设置为True，并应使用新投影将其再次添加到页面中。

这是迄今为止我发现的唯一没有直接攻击d3的解决方案。

清除地图和重绘的最佳方法

3 个答案: