EV Charging Station Story Map_Shuya Guan#20
EV Charging Station Story Map_Shuya Guan#20shuyaguan wants to merge 9 commits intoWeitzman-MUSA-JavaScript:mainfrom
Conversation
junyi2022
left a comment
junyi2022
left a comment
There was a problem hiding this comment.
Nice map! I like the rotation of the map. Some things to note in this overall comment:
- You need to enable GitHub Pages so people can access your website online. You can do it through your repository -> settings -> Pages
- Your GitHub eslint failed. You can check those css errors when you click on the red cross at the top of your repository's codespace.
| Target Audience： | ||
| This project is intended for: |
There was a problem hiding this comment.
Suggestion: If you want your text to start at a new line in the rendered view, you should have at least two spaces at the end of the previous line or an empty line between two lines.
| Target Audience： | |
| This project is intended for: | |
| Target Audience： | |
| This project is intended for: |
| <p>In contrast, rural regions and smaller towns may have fewer stations, but the map helps identify key charging locations to ensure drivers are never too far from a power source. The map also highlights different types of charging options, from rapid chargers to standard ones, catering to diverse vehicle needs.</q> | ||
| <p>The map also highlights various types of charging options, from rapid chargers to standard ones, catering to the diverse needs of different vehicles. This tool is particularly valuable for electric vehicle owners, urban planners, and researchers in clean energy infrastructure, offering insights into the distribution of charging stations and the variety of charging facilities available.</q> | ||
| <div style="max-width:100%; text-align:center; margin-left:auto; margin-right:auto"> | ||
| <img src="data/images/commercial-ev-charging-station.jpg" alt="Image caption" style="max-width:75%; height:auto;"> |
There was a problem hiding this comment.
Suggestion: Usually it is not a good practice to have style tags in HTML because it is very hard to overwrite them (if at some point you need to overwrite something). Even though this is a HTML in javascript, you can still use class to adjust the style in CSS. Besides, the alt is for your image description when someone can't see the actual image. You can have more specific descriptions of your images.
| <img src="data/images/commercial-ev-charging-station.jpg" alt="Image caption" style="max-width:75%; height:auto;"> | |
| <img src="data/images/commercial-ev-charging-station.jpg" alt="EV charging Station" class="xxxx"> |
| @media (max-width: 750px) { | ||
| #features { | ||
| width: 90vw; | ||
| margin: 0 auto; | ||
| } | ||
| } |
There was a problem hiding this comment.
Suggestion: If you are not doing mobile compatibility for other parts of your website, you don't need to have this.
| @media (max-width: 750px) { | |
| #features { | |
| width: 90vw; | |
| margin: 0 auto; | |
| } | |
| } |
| width: 100%; | ||
| position: relative; | ||
| z-index: 5; | ||
| padding: 2vh 0vh 5vh 0vh; |
There was a problem hiding this comment.
Suggestion: You don't need to add units for 0. Besides, if the second and forth are the same, you can only write it once.
| padding: 2vh 0vh 5vh 0vh; | |
| padding: 2vh 0 5vh; |
| #header h1 { | ||
| font-weight: 700; | ||
| text-transform: uppercase; | ||
| font-family: 'Roboto', serif; |
There was a problem hiding this comment.
| font-family: 'Roboto', serif; | |
| font-family: Roboto, serif; |
3 participants
This project presents a map of charging stations across Pennsylvania, highlighting the spatial distribution characteristics and specific locations in different regions. The map aims to provide a clear and comprehensive visualization of where charging stations are concentrated and how they are distributed in both urban and rural areas.