D3.js SVG图层未重新缩放宽度贴图图层

D3.js SVG图层未重新缩放宽度贴图图层,d3.js,leaflet,D3.js,Leaflet,我使用传单,有地图层和svg层。但是当我缩放时,svg层与地图层的大小不成比例。这使得svg层大小错误,并且不显示我的svg内容 这是我的密码 MapLeaflet.prototype.init = function (map) { let $$ = this; $$.dom = map; this.map = L.map(map).setView([-6.175239, 106.827204], 13); L.tileLayer('http://{s}.basemaps.car

我使用传单,有地图层和svg层。但是当我缩放时,svg层与地图层的大小不成比例。这使得svg层大小错误,并且不显示我的svg内容

这是我的密码

MapLeaflet.prototype.init = function (map) {
  let $$ = this;
  $$.dom = map;
  this.map = L.map(map).setView([-6.175239, 106.827204], 13);
  L.tileLayer('http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png').addTo($$.map);

  this.svg = d3.select($$.map.getPanes().overlayPane).append("svg")
    .attr('style', 'display: flex; flex: 1 1 auto; min-height: 100vh; min-width: 100vw; position: relative; flex-grow: 1')
    .append("g").attr("class", "leaflet-zoom-hide");
}

我不应该手动添加SVG层。单张有自己添加svg层的功能

这是我的最终代码

MapLeaflet.prototype.init = function (map) {
  let $$ = this;
  $$.dom = map;
  this.map = L.map(map).setView([-6.175239, 106.827204], 13);
  L.tileLayer('http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png').addTo($$.map);

  var svgLayer = L.svg();
  svgLayer.addTo(this.map);
  this.svg = d3.select('svg g');
}