Chapter 14: Line and Polygon Examples

From Mapping in the Cloud by Michael Peterson

Assignments from (insert your name here)

All Google Maps API examples here do not use a key. Domains and related sub-domains that had used Google Maps API before June 22, 2016 should find that these code samples still function without a key. The keyless examples work from this page because the maps.unomaha.edu server was using the Google Maps API many years before this new requirement came into effect. If the Google Map examples below don't work once you upload them to your server, you need to get a free key from Google. Further details of this new requirement and other changes to the Google Maps API usage policy can be found at this site. The key that Google provides to you for free would be added to the call to the API, like this:

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"></script>

All of code samples below would then need to be modified to include this API key.

Lines

  1. 14_01a_Simple_Line - Draw a line that shows your general route home.
  2. 14_01b_Dashed_line - Draw a dashed line between two points.
  3. 14_01c_Arrow - Draw an arrow between two points.
  4. 14_01d Route_Line - Change the title, points, description, and size.
  5. 14_02_Flow_Map - Map out data on the number of eople that fly between three different airports in the US. Data can be found through this List of busiest passenger air routes. Make the thinnest line 2 pixels and the thickest 20 pixels wide . Include the calculated widths of the lines below the map.
  6. 14_03a_Geodesic_Line - Make a single map that shows the great circles between three major cities in the world.
  7. 14_03b_Great_Circle_input - Modify the color and thickness of the resultant line.
  8. 14_04_Mapping_lines_from_an_XML_file - Enter new points and infowindow text in the "example.xml" file.
  9. 14_05a_Mapping_lines_from_JSON_file - Enter new points in the "SW.json" file. May not display in Dreamweaver.
  10. 14_05b_Mapping_lines_from_geoJSON_file - Create a new line and display.
  11. 14_06a_Mapping_lines_from_KML_file.htm - Change the coordinates for the line in the kml_lines.kml file. Change the address of the kml_lines.kml file so that it points to your directory. It should not point to the maps.unomaha.edu server.
  12. 14_06b_Mapping_flight_track_great_circle.htm - Map out a flight track between two cities and the corresponding great circle route.
  13. 14_07_Mapping_lines_from a Fusion_Table.htm - Download the tornadoes Fusion Table as CSV and upload to your Google Drive. Share your Fusion Table. Change the symbolization of the lines and link to your version.
  14. ADVANCED: 14_08a_Mapping_500ft_contours_from_Fusion_Table.htm - Convert the cntrs200_n83.shp.zip from the code14data_FTP folder to a KML and upload to a FusionTable.
  15. 14_08b_Mapping_flight line from_Fusion_Table.htm - Upload the KML file from 14.06b to a Fusion Table. Share your Fusion Table and change the link. May not display in Dreamweaver.
  16. 14_08c_Mapping_flight line from a geoJSON file - Upload the data from 14.06b to http://geojson.io using Open/File. Download (Save) as geoJSON. Link to this file. May not display in Dreamweaver.
  17. 14_09_Line_Input - Change the center, line width and line color of the line that is drawn.
  18. 14_10_Cross_section - Make a cross-section that is perpendicular to a mountain or river valley.
  19. 14_10a_Elevation service - Change location and size of map. Add feet to the infowindow. Replace this text with a title.
  20. 14_11_Polyline_Encoding.htm - Encode a line segment and map the line by copying and pasting the encoded polyline into the following code: 14_11a_Display_Encoded_Polyline.htm
  21. 14_12a_Route_Line - Create a route that connects two places.
  22. 14_12b_Route_Choice - Create a route that connects two places.
  23. 14_12c_Draggable_Distance - Create a route that connects two places.

Areas

  1. 14_13a_Single_polygon - Change center and create a polygon and fill with a different color.
  2. 14_13b_Draggable_polygon - Change center to a more northerly location and create a polygon with 4 points and fill with a different color.
  3. 14_13c_Point_in_Polygon - Change center and create a polygon and fill with a different color.
  4. 14_14_Mapping_polygon_from_XML_file.htm - Create a new polygon and change the center and polygon color.
  5. ADVANCED: 14_15_inside_Polygon_Vienna.html - Create another donut polygon.
  6. ADVANCED: 14_16_Inside_KML_Polygon.html - Create a new donut polygon in the kml_polygons.kml, change the center and polygon color.
  7. 14_22a_Nebraska_Unclassed Choropleth_Opacities.html - Find data for Nebraska by county. Copy and paste the data into an Excel spreadsheet. Add a comma after each value using concatenate. Create a single string of comma-delimited values by using the transpose option. This is done by copying the column of data and using the transpose option to paste. Paste options are available under the arrow next to Paste in the Home tab.
  8. 14_22b_Nebraska_Unclassed_Grey - Uses grey shades between 0-255 defined with identical r,g,b values. Display same data as previous example.
  9. 14_22c_Nebraska_Unclassed_Grey_Exponent - The perception of grey shades is underestimated so an exponent is applied here to modify shadings. Display same data as previous example.
  10. 14.22c2_Nebraska_Unclassed_Blue_Exponent - Change to red or green colors.
  11. 14_22d_Display_World_GeoJSON - Change scale and size of map.
  12. 14_22e_Display_US_GeoJSON - Find another geoJSON file to display.
  13. 14_22f_Click_Style_GeoJSON - Change color and size.
  14. 14_22g_Display_California_TOPOjson - Change scale and size of map.
  15. 14_22h_Display_US_County_TOPOjson - Change scale and size of map.
  16. 14.22i_Choropleth_map_from_geoJSON - Change the variable mapped using instructions within the code.
  17. 14.22l_Choropleth_map_from_topoJSON - Change the variable mapped using instructions within the code.
  18. 14_23_Fusion_Tables_Shaded_Polygons.html - Open this Fusion Table and download as a CSV. Go to Google Drive and import the file. The data are described in the USCensusDataDescription.txt file. Create a choropleth map with five categories under Change Feature Styles. Add legend. Publish the map . Reference
  19. 14_24_Fusion_Table_Heatmap_Tornadoes.htm - Change the display of the heatmap.
  20. 14_25_Fusion_Table_Heatmap_Coral_Bleaching.htm - Add a third map to the display at an intermediate scale

Extra credit

  1. Create a cross-section from Los Angeles to New York.
  2. Convert a shapefile of a state outline to a KML file using the mygeodata converter.

Back to my assignments page