NeonXP/react-native-raster-maps
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Added onLoadTile prop

Browse source
This commit is contained in:
Alexander NeonXP Kiryukhin 2019-06-09 21:17:10 +03:00
parent 5cdad747be
commit 4bbfa9ff84
2 changed files with 15 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "react-native-raster-maps", "name": "react-native-raster-maps",
"version": "1.0.1", "version": "1.0.2",
"description": "Based on https://pigeon-maps.js.org/.", "description": "Based on https://pigeon-maps.js.org/.",
"main": "src/index.js", "main": "src/index.js",
"scripts": { "scripts": {

20
src/index.js
View file

@ -1,5 +1,5 @@
import React, { PureComponent } from 'react' import React, { PureComponent } from 'react'
import { Image, View, PixelRatio, PanResponder } from 'react-native' import { TouchableOpacity, View, PixelRatio, PanResponder } from 'react-native'
import Svg, { Polyline, Polygon } from 'react-native-svg' import Svg, { Polyline, Polygon } from 'react-native-svg'
import * as FileSystem from 'expo-file-system'; import * as FileSystem from 'expo-file-system';
import Tile from './tile' import Tile from './tile'
@ -262,7 +262,8 @@ export default class Map extends PureComponent {
return dprs.map(dpr => url(x, y, z, dpr) + (dpr === 1 ? '' : ` ${dpr}x`)).join(', ') return dprs.map(dpr => url(x, y, z, dpr) + (dpr === 1 ? '' : ` ${dpr}x`)).join(', ')
} }
imageLoaded = (key) => { imageLoaded = (x, y, z) => {
const key = `${x}-${y}-${z}`
if (this._loadTracker && key in this._loadTracker) { if (this._loadTracker && key in this._loadTracker) {
this._loadTracker[key] = true this._loadTracker[key] = true
@ -272,6 +273,7 @@ export default class Map extends PureComponent {
this.setState({ oldTiles: [] }, NOOP) this.setState({ oldTiles: [] }, NOOP)
} }
} }
this.props.onLoadTile && this.props.onLoadTile(x, y, z)
} }
getBounds = (center = this.state.center, zoom = this.zoomPlusDelta()) => { getBounds = (center = this.state.center, zoom = this.zoomPlusDelta()) => {
@ -513,9 +515,14 @@ export default class Map extends PureComponent {
} }
const xy = this.latLngToPixel(coords, center, zoom + zoomDelta) const xy = this.latLngToPixel(coords, center, zoom + zoomDelta)
return <View style={[{ return <TouchableOpacity
left: xy[0] + dx - (child.props.width || 32) / 2, top: xy[1] + dy - (child.props.height || 32) / 2, position: 'absolute' onPress={child.props.onPress || NOOP}
}, child.props.style]}>{React.cloneElement(child, {})}</View> style={[{
left: xy[0] + dx - (child.props.width || 32) / 2, top: xy[1] + dy - (child.props.height || 32) / 2, position: 'absolute'
}, child.props.style]}
>
{React.cloneElement(child, {})}
</TouchableOpacity>
}); });
return childrenWithProps return childrenWithProps
} }
@ -626,6 +633,7 @@ export default class Map extends PureComponent {
height: 256 * scale, height: 256 * scale,
active: true, active: true,
opacity: 1, opacity: 1,
x, y, z: roundedZoom,
}) })
} }
} }
@ -642,7 +650,7 @@ export default class Map extends PureComponent {
position: 'absolute', position: 'absolute',
opacity: tile.opacity opacity: tile.opacity
}} }}
onLoad={() => this.imageLoaded(tile.key)} onLoad={() => this.imageLoaded(tile.x, tile.y, tile.z)}
/> />
)) ))
} }