Почему адаптивная картографическая карта возвращается к размерам маленького экрана, когда экран становится больше? - PullRequest
0 голосов
/ 18 марта 2020

Ожидаемый: размер карты цветопередачи должен коррелировать с размером экрана.

Фактически: размеры карты корректны, когда браузер маленький и, кажется, увеличивается с ростом экрана браузера. Но тогда, когда браузер достигает ширины около 900 пикселей, карта возвращается к маленькому экрану.

Я использую viewBox, и это соответствующий код:

MapChart.prototype.initVis = function() {
  let vis = this;

  vis.myProjection = d3
    .geoMercator()
    .scale(2500)
    .precision(0.1)
    .translate([vis.dimensions.width / 3, vis.dimensions.height / 2])
    .center([67, 30]);

  vis.myPathGenerator = d3.geoPath().projection(vis.myProjection);

  // Define the div for the tooltip
  vis.div = d3
    .select("body")
    .append("div")
    .attr("class", "tooltip")
    .style("opacity", 0);

  vis.svg = d3
    .select(vis.parentElement)
    .append("svg")
    .attr("class", "card")
    .attr("viewBox", `0 0 800 800`);
  // .attr("width", vis.dimensions.width) >>> old code that is being replaced with viewBox code
  // .attr("height", vis.dimensions.height); >>> old code that is being replaced with viewBox code

//more code
.
.
.
}

Если это полезно, это весь проект: https://github.com/SabahatPK/DataDrivenPakistan. Это рабочая версия, поэтому в ней нет строки кода viewBox, но все остальное точно так же.

...