changing controlled drawing mode completes current shape but doesn't call onXXXComplete handler
See original GitHub issueI have this component (unrelated code was removed)
const MapView = withScriptjs(withGoogleMap(class extends React.PureComponent {
state = {
isDrawing: false,
}
onPolygonCompleted = polygon => {
console.log('=== polygon ===', polygon);
const coordinates = getPathsArraysFromPolygon(polygon);
polygon.setMap(null);
}
onKeyDown = event => {
if (event.keyCode === 27) { // escape button
this.setState(() => ({
isDrawing: false,
}));
}
}
componentDidMount () {
window.addEventListener('keydown', this.onKeyDown);
}
componentWillUnmount () {
window.removeEventListener('keydown', this.onKeyDown);
}
render () {
const {
isDrawing,
} = this.state;
return (
<GoogleMap >
<DrawingManager
drawingMode={isDrawing ? window.google.maps.drawing.OverlayType.POLYGON : null}
onPolygonComplete={this.onPolygonCompleted}
onOverlayComplete={(...args) => console.log('=== onOverlayComplete ===', ...args)}
onCircleComplete={(...args) => console.log('=== onCircleComplete ===', ...args)}
onMarkerComplete={(...args) => console.log('=== onMarkerComplete ===', ...args)}
onPolylineComplete={(...args) => console.log('=== onPolylineComplete ===', ...args)}
onRectangleComplete={(...args) => console.log('=== onRectangleComplete ===', ...args)}
/>
<div id="draw-controls">
<Button
icon={isDrawing ? 'close' : 'plus'}
size="large"
onClick={() => {
window.component = this;
this.setState(({isDrawing}) => ({
isDrawing: !isDrawing,
}));
}}
/>
</div>
</GoogleMap>
);
}
}));
I use a custom button to toggle draw mode, and escape key to exit the drawing mode, but if I start drawing, then I press the escape key or the button, the points are connected to form a polygon, but none of the handlers is called - which means that I don’t have a reference of the newly drawn polygon
Issue Analytics
- State:
- Created 6 years ago
- Reactions:5
- Comments:9
Top Results From Across the Web
Prevent or allow changes to shapes - Microsoft Support
Select Run in developer mode and then click OK. Prevent or allow changes to shape attributes. Select a shape in your drawing. On...
Read more >CALayer Tutorial for iOS: Getting Started - RayWenderlich.com
Open it in Xcode, then build and run to see what you're starting with. The Layer Player app demonstrates nine different CALayer capabilities....
Read more >Xcode 13 Release Notes | Apple Developer Documentation
To support the new Swift concurrency model, clang can now warn if you call a completion handler more than once or if an...
Read more >c# - How can I make the cursor turn to the wait cursor?
You can use Cursor.Current . // Set cursor as hourglass Cursor.Current = Cursors.WaitCursor; // Execute your time-intensive hashing code ...
Read more >View - Android Developers
Call isInTouchMode() to see whether the device is currently in touch mode. ... This view is invisible, and it doesn't take any space...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
passing
drawingControl: false
to the drawing manager, and implementing my own button that switches the mode. here’s the code (the mode is set in the state and passed as a prop to the drawing manager)[@tyholby] this is the code
polygon => void