You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository has been archived by the owner on Oct 3, 2022. It is now read-only.
Rename section to "Plot data on a map: ScatterplotLayer"
Update learning objective. Replace "first contact with Deck.GL" with "Use Deck.GL to add ScatterplotLayer"
A few small changes to have a big impact:
move "checkout the completed code.." to the end of the section
Update Step 1 - taxi data
Simplify the instructions: "Add a _processData method that will - you guessed it - process the taxi data. We need: latitude, longitude, and pickup (to color the dots). And, call the method _processData when the component mounts
Add a question after the code block - "How can you test that you got the data points you need for the map?"
Change Step 2 "Render the deck.gl Component" and update instruction to just be 'Add Deck.gl to deckgl-overlay.js'
In Step 3, make a new section to update the layers array and title it "Initialize the ScatterplotLayer". Then, add a brief description "We have to initialize each deck.gl layer separately. Edit the render() function to initialize the ScatterplotLayer with the properties it needs. (then have the code block). Add: Check your map. What do you see?
Add section title: Add getColor callback. Make those instructions its own section. Instructions: Color the dots by pickup or dropoff. Edit ScatterplotLayer to have a unique color for pickup or dropoff by changing the getColor callback.
Add: Check the map. You should have a map with taxi data, in 2 colors.
Add Section title: Review ScatterplotLayer properties. Keep that content that you have that is a brief review.
Remove 'optional section' with skip instructions (implied with an online tutorial and the sidebar with the section titles makes it easy for someone to click what they want to learn)_
Rename Step 4 "Bonus: Add a few more functionalities". Add a brief explanation why this is bonus -- possibly "Feel free to add other functionalities. This is more exposure to what Deck.gl can do and how it looks in a React Component."
Remove Step numbers (1,2,3..) and just have the headers that describe what you'll build in that section. This keeps the instructions maintainable if you make changes in the future.
Idea - Add a bonus challenge to play with other taxi data to plot on the map. This will give engineers a chance to play with other data that comes in the taxiData, see what makes sense on the map and what doesn't, and for people newer to React, more exposure to how to access data in an object and get it to render on the page. If this sounds interesting, add this challenge before the section of reviewing the scatterplot layer properties. Instructions could be "Want to keep playing around with scatterplot data? Change the data you are using from taxiData and plot something else on the map."
The text was updated successfully, but these errors were encountered:
Sign up for freeto subscribe to this conversation on GitHub.
Already have an account?
Sign in.
A few small changes to have a big impact:
_processData
method that will - you guessed it - process the taxi data. We need: latitude, longitude, and pickup (to color the dots). And, call the method_processData
when the component mountslayers
array and title it "Initialize the ScatterplotLayer". Then, add a brief description "We have to initialize eachdeck.gl
layer separately. Edit therender()
function to initialize theScatterplotLayer
with the properties it needs. (then have the code block). Add: Check your map. What do you see?Add: Check the map. You should have a map with taxi data, in 2 colors.
Remove Step numbers (1,2,3..) and just have the headers that describe what you'll build in that section. This keeps the instructions maintainable if you make changes in the future.
Idea - Add a bonus challenge to play with other taxi data to plot on the map. This will give engineers a chance to play with other data that comes in the taxiData, see what makes sense on the map and what doesn't, and for people newer to React, more exposure to how to access data in an object and get it to render on the page. If this sounds interesting, add this challenge before the section of reviewing the scatterplot layer properties. Instructions could be "Want to keep playing around with scatterplot data? Change the data you are using from
taxiData
and plot something else on the map."The text was updated successfully, but these errors were encountered: