diff --git a/packages/geo/src/GeoMap.js b/packages/geo/src/GeoMap.js index eb719a695..782999ae1 100644 --- a/packages/geo/src/GeoMap.js +++ b/packages/geo/src/GeoMap.js @@ -13,8 +13,8 @@ import GeoGraticule from './GeoGraticule' import GeoMapFeature from './GeoMapFeature' import { useGeoMap } from './hooks' -const GeoMap = memo( - ({ +const GeoMap = memo(props => { + const { width, height, margin: partialMargin, @@ -33,85 +33,84 @@ const GeoMap = memo( isInteractive, onClick, tooltip: Tooltip, - }) => { - const { margin, outerWidth, outerHeight } = useDimensions(width, height, partialMargin) - const { graticule, path, getFillColor, getBorderWidth, getBorderColor } = useGeoMap({ - width, - height, - projectionType, - projectionScale, - projectionTranslation, - projectionRotation, - fillColor, - borderWidth, - borderColor, - }) + } = props + const { margin, outerWidth, outerHeight } = useDimensions(width, height, partialMargin) + const { graticule, path, getFillColor, getBorderWidth, getBorderColor } = useGeoMap({ + width, + height, + projectionType, + projectionScale, + projectionTranslation, + projectionRotation, + fillColor, + borderWidth, + borderColor, + }) - const theme = useTheme() + const theme = useTheme() - const [showTooltip, hideTooltip] = useTooltip() - const handleClick = useCallback( - (feature, event) => isInteractive && onClick && onClick(feature, event), - [isInteractive, onClick] - ) - const handleMouseEnter = useCallback( - (feature, event) => - isInteractive && Tooltip && showTooltip(, event), - [isInteractive, showTooltip, Tooltip] - ) - const handleMouseMove = useCallback( - (feature, event) => - isInteractive && Tooltip && showTooltip(, event), - [isInteractive, showTooltip, Tooltip] - ) - const handleMouseLeave = useCallback(() => isInteractive && hideTooltip(), [ - isInteractive, - hideTooltip, - ]) + const [showTooltip, hideTooltip] = useTooltip() + const handleClick = useCallback( + (feature, event) => isInteractive && onClick && onClick(feature, event), + [isInteractive, onClick] + ) + const handleMouseEnter = useCallback( + (feature, event) => + isInteractive && Tooltip && showTooltip(, event), + [isInteractive, showTooltip, Tooltip] + ) + const handleMouseMove = useCallback( + (feature, event) => + isInteractive && Tooltip && showTooltip(, event), + [isInteractive, showTooltip, Tooltip] + ) + const handleMouseLeave = useCallback(() => isInteractive && hideTooltip(), [ + isInteractive, + hideTooltip, + ]) - return ( - - {layers.map((layer, i) => { - if (layer === 'graticule') { - if (enableGraticule !== true) return null + return ( + + {layers.map((layer, i) => { + if (layer === 'graticule') { + if (enableGraticule !== true) return null - return ( - - ) - } - if (layer === 'features') { - return ( - - {features.map(feature => ( - - ))} - - ) - } + return ( + + ) + } + if (layer === 'features') { + return ( + + {features.map(feature => ( + + ))} + + ) + } - return layer(this.props) - })} - - ) - } -) + return layer(props) + })} + + ) +}) GeoMap.propTypes = GeoMapPropTypes GeoMap.defaultProps = GeoMapDefaultProps diff --git a/packages/geo/src/GeoMapCanvas.js b/packages/geo/src/GeoMapCanvas.js index 73c0a1a30..0819524d4 100644 --- a/packages/geo/src/GeoMapCanvas.js +++ b/packages/geo/src/GeoMapCanvas.js @@ -103,7 +103,7 @@ const GeoMapCanvas = props => { } }) } else { - layer(this.ctx, props) + layer(ctx, props) } }) }, [