0

当我想显示墨西哥地图时我遇到了这个问题在此处输入图像描述 正如你所看到的没有完全显示,我不想放大,我只想让地图居中显示并且完整

到目前为止,这是我的代码。

const geoUrl = 'https://gist.githubusercontent.com/diegovalle/5129746/raw/c1c35e439b1d5e688bca20b79f0e53a1fc12bf9e/mx_tj.json'
//const geoUrl = mapa2 ;
return (
<div>
<h1>Bienvenido a Blog!</h1>
<ComposableMap style={{backgroundColor:'gray'}} projection={'geoAlbers'}>
      <Geographies style={{backgroundColor:'green', bottom:100}} geography={geoUrl}>
        {({ geographies }) =>
          geographies.map(geo => (
            <Geography key={geo.rsmKey} geography={geo} />
          ))
        }
      </Geographies>
  </ComposableMap>
4

1 回答 1

0

要使地图居中,您可以使用projectionConfig带有center. 就像是:

<ComposableMap
      style={{ backgroundColor: "gray" }}
      projection="geoAlbers"
      projectionConfig={{
        center:[-5, 25]
      }}
 >

结果是:

在此处输入图像描述

此处修改了您的代码的代码框。

于 2021-09-01T08:31:29.143 回答