Почему моя карта D3.js GeoJSON не отображается правильно в Firefox?

Question

Я использую D3.js (v5) для создания карты районов Нью-Йорка.В Edge, Chrome и Internet Explorer карта отображается правильно, но у меня возникают проблемы в Firefox.Все мои пути SVG нарисованы, но они показаны вверх ногами и слишком малы.Поэтому кажется, что проекция работает неправильно.Я думаю, что это может иметь какое-то отношение к fitExtent().Я попытался использовать fitSize(), но это не решает проблему.Я также пытался использовать другую проекцию (например: d3.geoAlbersUsa()), но это также не решает проблему.

Когда я отключаю функцию масштабирования, проблема все еще сохраняется, так что это непричина (и, следовательно, здесь не отображается).

Кто-нибудь испытывал это раньше или знает, что вызывает эти различия?Я в правильном направлении, что это из-за проекции?И что я могу сделать, чтобы решить эту проблему?

Фрагмент кода:

try {
    await getData()
} catch(e) {
    console.error('Error while fetching data', e)
}

const svg = d3.select('#d3-map-holder svg')
const zoomGroup = svg.append('g').classed('zoom-group', true)
let city = zoomGroup.append('g').classed('new-york-group', true)
let nycData

async function getData() {
    [nycData] = await Promise.all([ d3.json('https://services5.arcgis.com/GfwWNkhOj9bNBqoJ/arcgis/rest/services/nybb/FeatureServer/0/query?where=1=1&outFields=*&outSR=4326&f=geojson')
    ])

 drawChart(nycData);
}

async function drawChart(nycData) {
  let cityWidth = document.body.clientWidth
  let cityHeight = document.querySelector('#d3-map-holder svg').clientHeight

  let projection = d3.geoEquirectangular()
        .fitExtent([[12, 20], [cityWidth - 6, cityHeight - 10]], nycData)

  let path = d3.geoPath().projection(projection);

   city.selectAll('path')
    .data(nycData.features)
    .enter()
      .append('path')
      .attr('d', d => path(d))
}