反应传单-使用CRS将X/Y LatLng修改为从中心而非左下角工作

Question

嘿，有人能更改react传单中的X/Y轴起点吗？我需要我的坐标从地图的中间开始工作，而不是使用CRS从左下角开始工作。以下是我到目前为止所拥有的，任何一点朝着正确的方向都会很棒！

componentDidMount() {
if ( __CLIENT__ ) {
Leaflet = require('leaflet');
LeafletCRS = Leaflet.CRS.Simple;
this.setState({
leafletLoaded: true
});
}
}
render() {
const bounds = [[0, 0], [600, 600]];
return (
<div className="columns small-12 medium-6">
<Map
style={ { width:'600px',height: '600px' } }
minZoom={ 1 }
center= { [0, 0] }
maxZoom={ 2 }
bounds={ bounds }
crs={ LeafletCRS }
>
<ImageOverlay
url="IMG HERE"
bounds={ bounds }
/>
<Circle center= { [0, 0] } radius={5} fillColor="blue" />
</Map> 
</div>
)

Answer 1

最好的例子是-http://plnkr.co/edit/5SQqp7SP4nf8muPM5iso?p=preview&预览

L.CRS.MySimple = L.extend({}, L.CRS.Simple, {
// At zoom 0, tile 268x268px should represent the entire "world" of size 8576x8576.
// scale is therefore 8576 / 268 = 32 (use the reverse in transformation, i.e. 1/32).
// We want the center of tile 0/0/0 to be coordinates [0, 0], so offset is 8576 * 1/32 / 2 = 268 / 2 = 134.
transformation: new L.Transformation(1 / 32, 134, -1 / 32, 134)
});

你只需要修改数学量表以适合你的