Transcribed TextTranscribed Text

Homework 5 2. Create force simulation withthe airports ison file on blackboard You should modi fy the 08 force (draggable html file in the book examples on blackboar (use the second edition file). You have touse d3 json() to load the json file Place the airports json file in the same directory asthe html file. Use the below code. Note that the entire code for the forcelayout should be inside the callback function for the d3.json(). Thisi because the data loading asynchronous (the data cont tinuest olo while code outside the callback function executed). So, ifthe code outside the callback function then will runbefore the data gets fully loaded. Also, note that the d3 json syntax ha: schanged in D3 V5 (whichis most likely what you are using). Most of the syntaxin the examples on the web using the older version wh nich actually does not work anymore. d3 json(" "airports json' O.t he (funct cion(data){ //put all the force layout code here }); Now add mouseover event listener to the nodes so that when ou hover over circle with your mouse the name of the airport displayed. Hint: you have to use the nodes append("title") and .text(function(d) {return name; to append title with the name value in the ison file. You can actually open thejson file your browser tosee how looks. If you are using chrome then you may not be able to reada ison local file. So, you neec to set up local http server be able to read the file (Chrome prevents reading of local files for security reasons). Follow the steps belowto set up the http server. 1. Make sure the directory in which pythonisinstalled isin the windows path. Ifitis an anaconda install thenthe typical path something like this C: Users ppDat \\Local\ Continuum\Anaconda3. You can add to path by going to system settings and clicking on environment variables and under system variables choose the pathvariable and dick edit. Now typeinthe path at the end (note the paths are separated by semicolons, soput semicolon before typing in). 2. Now open command window (dick the windowsicon and the search box type cmd and hit enter). Now change directory to where you have the html file (and d3 is etc saved. 3. Issue the following command to start up http server python-m http server This will start up ahttp server on port 8000. You should see something like this: \Windows\system 32\cmd.exe python -m http server 53 Copyright 2889 Corporat ion. All rights reserved. he Find the path specified. \Users\ jjayaranan>cd documents\d3 erving HTIP 0.0 port 8000 Chttp ite nase 0:8000 ... 4. Now to run the html file open the browser and type localhost:8000. It will show you a directory listing from which youcanchoose the html file that you want torun. Note: if you hada html file named index.html, then typing localhost:8000 will automatically runthe index html file. For more infoonlocal web server you can refer to https://developer. mozilla org/en- questions/set up local testing server 3. Create map of Asia using the asia ison GeoJson file on blackboard You should modify the 04 fill html file from: book examples (use the second edition file). Change the svg width to 960 and height to 500. Change the scale to 200. Use the d3 .geoMercator for the projection Be sureto change the d3 .json syntax as per previous question to make workinD3 V5 If you are not teeeing map, it could be due to falling outside the svg box, so, adjust the scale the projection to make fit intothe svg. 4. Create choroplethmapof Africa with each country population. The Geolson file for Africa (africa.json) and the population data (africapopulation.csv) are provided on blackboard. You should modify the os _choropleth htmli the second edition book examples

Solution PreviewSolution Preview

These solutions may offer step-by-step problem-solving explanations or good writing examples that include modern styles of formatting and construction of bibliographies out of text citations and references. Students may use these solutions for personal skill-building and practice. Unethical use is strictly forbidden.

"nodes": [
      "id": 1,
      "name": "Hartsfield–Jackson Atlanta International Airport",
      "country": "United States",
      "passengers": 22746009,
      "latitude": 33.640728,
      "longitude": -84.4277
      "id": 2,
      "name": "Beijing Capital International Airport",
      "country": "China",
      "passengers": 21663240,
      "latitude": 40.079857,
      "longitude": 116.603112
      "id": 3,
      "name": "Dubai International Airport",
      "country": "United Arab Emirates",
      "passengers": 19606327,
      "latitude": 25.253175,
      "longitude": 55.365673
      "id": 4,
      "name": "Tokyo Haneda Airport",
      "country": "Japan",
      "passengers": 18053930,
      "latitude": 35.549393,
      "longitude": 139.779839
      "id": 5,
      "name": "Los Angeles International Airport",
      "country": "United States",
      "passengers": 16416281,
      "latitude": 33.941589,
      "longitude": -118.40853
      "id": 6,
      "name": "London Heathrow Airport",
      "country": "United Kingdom",
      "passengers": 16364246,
      "latitude": 51.470022,
      "longitude": -0.454295
      "id": 7,
      "name": "Hong Kong International Airport",
      "country": "China",
      "passengers": 16328000,
      "latitude": 22.308047,
      "longitude": 113.918481
      "id": 8,
      "name": "O'Hare International Airport",
      "country": "United States",
      "passengers": 16258025,
      "latitude": 41.974162,
      "longitude": -87.907321

By purchasing this solution you'll be able to access the following files:

for this solution

PayPal, G Pay, ApplePay, Amazon Pay, and all major credit cards accepted.

Find A Tutor

View available Java Programming Tutors

Get College Homework Help.

Are you sure you don't want to upload any files?

Fast tutor response requires as much info as possible.

Upload a file
Continue without uploading

We couldn't find that subject.
Please select the best match from the list below.

We'll send you an email right away. If it's not in your inbox, check your spam folder.

  • 1
  • 2
  • 3
Live Chats