feat(compass): sync compass with globe #336
Conversation
| .compassIcon svg, .downloadIcon svg | ||
| fill: $textWhite | ||
| .compass svg | ||
| fill: #202B33 |
There was a problem hiding this comment.
What color is thta? Wouldn't it be better if the icon defines the default fill color itself and we overwrite only on hover?
| padding-left: emCalc(25px) | ||
| .compass | ||
| margin-right: emCalc(16px) | ||
| margin-left: emCalc(25px) |
There was a problem hiding this comment.
Why do we need these strange margins? Can we solve this in a better way with flexbox?
| @@ -17,6 +18,7 @@ const GlobeNavigation: FunctionComponent = () => { | |||
| const dispatch = useDispatch(); | |||
| const defaultView = config.globe.view; | |||
| const projectionState = useSelector(projectionSelector); | |||
| const globecheck = useSelector(globeViewSelector); | |||
There was a problem hiding this comment.
If we use the position from the redux store we only get a new value when the globe movement ends. It would be cooler if the icon rotation updates in realtime. Perhaps we can do a little trick and set the rotation as a css variable in the globe component.
| onClick={() => dispatch(setFlyToAction({...defaultView}))} | ||
| /> | ||
| style={{transform: `rotate(${globecheck.position.longitude}deg)`}}> |
There was a problem hiding this comment.
Using the longitude seems wrong because the north arrow of the icon rotates even if the globe's north is up. One of the camera rotation values could work better
No description provided.