3e:null 3f:["$","title",null,{"children":"MULHOLLAND_IAN | Ian Mulholland | Observable"}] 45:Tfa8,**Data Visualization Review: Filipe Santos** I really like your idea of cross analyzing the time savings and comparing it against the environmental impact (CO2). And normalizing the data is definitely essential for doing so, which you also tackled! Great job! The first question that I have here is: on your method for Chart 1, you state that you want to create a faceted scatterplot comparing trains and planes. Is your main target to compare the two transportation modes or the individual routes among themselves? If it is to compare the two transportation modes, don't you think that having them plotted in separate charts might make it harder and cause too much eye movement? One of the challenges that I believe the reader might find in the Chart 1 relies on the internalization of the new variables you created. Average of CO2 per passenger per Euro is not an easy concept to grasp, and combining it with the Travel Time per Euro indicator will definitely demand some time from the reader. I can thing of a few of things that could support mitigating any potential misunderstanding: i. Provide some textual information in the chart pointing to the conclusion/analysis you expect from the reader: "When it comes to explanatory analysis and leveraging this visual to share information with your audience (rather than just showing data), thoughtful use of color and text is one way we can focus the story, as illustrated in Figure 4.8. (Knaflic, p 110) ii. Add some visual affordances such as showing an average line could also be a way to help guiding your users towards some specific analysis in the chart. iii. For the sake of the storyline building, you might wanna provide this type of denser information after introducing other general chart to grasp the audience attention. In terms of visualization patterns, the top-left part of your screen tends to be where the user generally starts looking at, based on most of the visualization patterns (z-pattern; f-pattern; Gutenberg diagram) - https://vanseodesign.com/web-design/3-design-layouts/ ; Knaflic p.125). Maybe the more complex data could be introduced afterwards? However, it all depends on general storyline. I really liked that, given how much you are normalizing the data, you already expect that some datapoints shall end up very close to each other, which might, even if unintentionally, evoke Gestalt principle of Proximity. Your idea of adding a different color so you can better highlight the extremes and add the principle of Similarity was very well thought! Having the weeks on the X-Axis in Chart 2 was a really smart move based on what we learned regarding the how to plot time variables. One thing that I was having a hard time to understand on the bar charts is if you are calculating the averages for all the routes or for only one specific route. If it is only for one, is the idea to have some kind of filtering interaction? Or to show only the extreme(s)? On the other hand, if you are calculating the average for all the routes, how much does the absolute value really say anything? One thing that I thought of displaying on mine was the average % difference using Week 1 as baseline. (In fact, I would love some thoughts on this too!). That way the viewer will know how much more (or less) % they should expect to pay depending on the week. Of course, if your idea is to show only one specific route, I agree that probably the absolute number is also very relevant, and you can ignore the last part. To finish, I really liked how you are proposing an innovative analysis to understand the sustainability effects in transportation and, more specifically, in each single route. I think this a very interesting angle. I would just encourage that you establish a clear storyline from the user's perspective (who, what, how), by adding a general overview (in addition to your specific goals per chart). I sincerely believe you will create a very solid data visualization tool, and I am already curious to see it.46:T6c5,

Planning a holiday getaway?

What is the most efficient route and mode for a weekend holiday?

Train

${avgTrain}

Plane

${avgPlane}

When should you buy your ticket?

${ticketPriceWeek}

47:T735,**First things I see are:** - In the scatterplots, there is a lot of empty space, however there seem to be outliers (maybe not by the statistical definition) of routes. - On the barchart, the train bars are smaller than the plane bars and both are negative. **What is it telling me** - My scatterplots are a little misleading: the y-axises are on different scales (0-2 for trains and 0-10 for planes) so it's difficult to compare the modes. Even though Berlin-Warsaw train appears to be a lot, compared to planes it's quite low. **Strengths** - The questions that each visual is attempting to answer is interesting. - I think the use of color in the scatterplots help pull out the routes that are lowest in CO2 and time per Euro. **Weaknesses** - For the scatterplots, I agree with Filipe that the axises are difficult to understand conceptually. CO2 / passenger / Euro is a bit of a complex unit to understand. - Additionally, the labels of the routes on the scatter plots don't necessarily add as much as I'd hoped - they are all very close to one another and make it difficult to differentiate. - I was looking to answer "what is the most optimal route by each method", but the scatterplots seem to be too complex. The question might be interesting, but visually it's difficult to understand and might not be appropriate. - On the bar chart, it's difficult to compare the the price trends for each mode over time. This does a better job at comparing plane vs. train than it does plane in week 1 with plane in week 2, which is the question I think aligns with my goal better. I think it might be better to just put this into a line chart looking at it this way. **Missing** - Rather than what's missing, I think this visualization is a bit *too* much. There are multiple concepts and the visualizations don't necessarily fit as one. - 48:Ta80,

Planning a holiday getaway?

What will a weekend trip cost?

Emissions by Route

${alpha1}

${co2ByRouteChart}

Overall, planes cause more CO2 emissions than trips by trains.Overall, 89% of emissions are caused by plane travel compared to train travel in this dataset. London-Marseille caused 28% of emissions alone.

Time by Route

${alpha2}

${travelTimeByRouteChart}

Train travel however takes longer than plane travel. On average, train travel takes almost 4 times as long as plane travel (3.9 times).

Price by Weeks Ahead Purchased

${alpha}

${averageTicketPriceChart}

Train tickets are cheaper than plane tickets on average. However, train ticket prices rise at a faster rate than planes if you purchase tickets 5-3 weeks before your trip. Plane tickets increase 30+% between weeks 3 and 1 week ahead of your trip.

49:T522,The goal of this visualization remains similar to the original design: **what is the best route to take?** The goal of the final design is to help holiday travelers make a more informed decision on which method and route of travel will cost. I’ve defined cost by CO2 emissions, time, and money. To answer this question, I’ve created three charts: 2 stacked bar charts showing the cost of train travel and plane travel for each route in terms of CO2 and time and one line chart showing on average the cost of buying a ticket for each mode. I chose stacked barcharts as a way to show the total amount of CO2 contributions and average time for each route and the proportion of each mode of transportation. We’ve spoken in class about the shortcomings of stacked bar charts, but I believe that since we only have 2 categories (the mode), the stacked barcharts show the approximate proportion of trains vs. plane carbon emissions and still communicate the overall message that planes contribute the most CO2 and trains take longer to travel. For the line graph comparing the prices, I chose to change my original bar chart to a line graph. The barcharts were difficult to compare across time and limited the comparison within each week. A line graph showed the convergence and divergence of prices much better.4a:T6bc,The feedback from my original sketches and graphing the data in this platform was really helpful in seeing the limitations of my visual artifact. During my data exploration, I expanded the dataset to a lot of different questions, converged on a very complex question in my first design, and diverged a bit on my next iteration. I think the feedback of simplifying my visuals a bit was so helpful in getting the message I aimed to communicate more clearly. By designing my graphs on the CO2 emissions and the Time rather than the Mode, it's a lot easier to compare routes. I can see how complicated adding more Gestalt elements can be in reducing the Pragnantz of my visual. I think I learned how powerful transforming the data is in uncovering answers and how sometimes the data can determine the type of visual as well. For example, I thought that a scatterplot would help me answer "Which route is the most efficient"; however this turned to be a really complex, cluttered, and difficult to compare method. However, there were some things I had a little trouble with that I'd like to work on: - There's a lot of white space in my final SVG. Knaflic talks about using white space with purpose - however I think the spacing in my visual looks more empty than clean. - I would've liked to reverse the x-axis on my Price by Weeks Ahead Purchased chart, however I couldn't quite figure it out without creating an extra array! - I would've also liked to use enclosure to highlight the points I was trying to make in my narrative in the visualization - I didn't know how to add those. - I also couldn't figure out how to get my legend to be the exact colors - I considered not even putting a legend in - it's an eyesore for me!4b:[{"id":"9e4f065c6c51b8ee3754f6a51cae69d0582bb0cb2cb524ae2a9dc0c915b20c466fc91f01c6c467e331a6c13396d3e39dafe372c965469e0da68a99900c49010a","href":"https://static.observableusercontent.com/files/9e4f065c6c51b8ee3754f6a51cae69d0582bb0cb2cb524ae2a9dc0c915b20c466fc91f01c6c467e331a6c13396d3e39dafe372c965469e0da68a99900c49010a","name":"CO2_data.csv","type":"text/csv","lastModified":1675825697829.973,"size":2540},{"id":"9e4f065c6c51b8ee3754f6a51cae69d0582bb0cb2cb524ae2a9dc0c915b20c466fc91f01c6c467e331a6c13396d3e39dafe372c965469e0da68a99900c49010a","href":"https://static.observableusercontent.com/files/9e4f065c6c51b8ee3754f6a51cae69d0582bb0cb2cb524ae2a9dc0c915b20c466fc91f01c6c467e331a6c13396d3e39dafe372c965469e0da68a99900c49010a","name":"CO2_data@3.csv","type":"text/csv","lastModified":1675828471028.835,"size":2540},{"id":"1094b497a32d3acef6ebac9eb2acdf7b89158cb3bacd1ef0ce572b38430036829af3e9f5ad8d581bb326bea7673af0548f4d52f58f7c491f61182bf9aac3ef74","href":"https://static.observableusercontent.com/files/1094b497a32d3acef6ebac9eb2acdf7b89158cb3bacd1ef0ce572b38430036829af3e9f5ad8d581bb326bea7673af0548f4d52f58f7c491f61182bf9aac3ef74","name":"fsg.jpg","type":"image/jpeg","lastModified":1675840078904.915,"size":104602},{"id":"9e4f065c6c51b8ee3754f6a51cae69d0582bb0cb2cb524ae2a9dc0c915b20c466fc91f01c6c467e331a6c13396d3e39dafe372c965469e0da68a99900c49010a","href":"https://static.observableusercontent.com/files/9e4f065c6c51b8ee3754f6a51cae69d0582bb0cb2cb524ae2a9dc0c915b20c466fc91f01c6c467e331a6c13396d3e39dafe372c965469e0da68a99900c49010a","name":"CO2_data@1.csv","type":"text/csv","lastModified":1675825766644.963,"size":2540},{"id":"9e4f065c6c51b8ee3754f6a51cae69d0582bb0cb2cb524ae2a9dc0c915b20c466fc91f01c6c467e331a6c13396d3e39dafe372c965469e0da68a99900c49010a","href":"https://static.observableusercontent.com/files/9e4f065c6c51b8ee3754f6a51cae69d0582bb0cb2cb524ae2a9dc0c915b20c466fc91f01c6c467e331a6c13396d3e39dafe372c965469e0da68a99900c49010a","name":"CO2_data@2.csv","type":"text/csv","lastModified":1675827117016.078,"size":2540},{"id":"ee8ce2a89d8018705effd56213f88392af0eb353feaf83ace16dc2b992761b2bad2dca09b2c1c7e74760c54fd08c03c07c699b2e8a9b35ee5838e937a4c68a8d","href":"https://static.observableusercontent.com/files/ee8ce2a89d8018705effd56213f88392af0eb353feaf83ace16dc2b992761b2bad2dca09b2c1c7e74760c54fd08c03c07c699b2e8a9b35ee5838e937a4c68a8d","name":"IMG_9237.jpg","type":"image/jpeg","lastModified":1675983714644.099,"size":3355204},{"id":"da37c1f1f4cada781946d54445382194c29cce8310233f3da87eed3b22ea4a9dba63a68069d6ef292aee08fd36adc60cf9985a7d1c025623199ed807945d0f40","href":"https://static.observableusercontent.com/files/da37c1f1f4cada781946d54445382194c29cce8310233f3da87eed3b22ea4a9dba63a68069d6ef292aee08fd36adc60cf9985a7d1c025623199ed807945d0f40","name":"IMG_9240.jpg","type":"image/jpeg","lastModified":1675983723219.098,"size":3378992},{"id":"68777ba2649f3ecc2a20cb841d7f78506d3cc0f80b2e6a0d5de18952b336f521d267e88de1c0b57e2033b609fc773d723344f2b8d49ce7fd5c79f2d7b97d46f1","href":"https://static.observableusercontent.com/files/68777ba2649f3ecc2a20cb841d7f78506d3cc0f80b2e6a0d5de18952b336f521d267e88de1c0b57e2033b609fc773d723344f2b8d49ce7fd5c79f2d7b97d46f1","name":"IMG_9241.jpg","type":"image/jpeg","lastModified":1675983729502.111,"size":3360173}] 43:{"id":"1a6c9eca31d3885d","slug":null,"title":"MULHOLLAND_IAN","thumbnail":"efabb3b7b267e839ef1918f57b42a42471b8782fc0e60992d21149f50b3fb8c1","access_level":"public","create_time":"$D2023-02-08T03:03:20.467Z","update_time":"$D2023-02-14T03:02:48.868Z","view_time":null,"first_public_time":"$D2023-02-08T03:03:20.467Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"498b5eebd648902d","login":"ian-mulholland","name":"Ian Mulholland","avatar_url":"https://avatars-next.observableusercontent.com/b17de045636f24ac3bb85f3250009468422824a9819cb36269fb0a47559dc0c5","tier":"starter_2024","bio":"","following":false},"version":1011,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"d151400cf935c88d","login":"ian-mulholland","name":"Ian Mulholland","avatar_url":"https://avatars-next.observableusercontent.com/b17de045636f24ac3bb85f3250009468422824a9819cb36269fb0a47559dc0c5","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"d151400cf935c88d","login":"ian-mulholland","name":"Ian Mulholland","avatar_url":"https://avatars-next.observableusercontent.com/b17de045636f24ac3bb85f3250009468422824a9819cb36269fb0a47559dc0c5","tier":null,"role":"editor"},{"type":"individual","id":"2cdb0080ec3a42af","login":"astoria","name":"Astoria","avatar_url":"https://avatars-next.observableusercontent.com/c85d1235e48998830d5220a3701f762810498b1462e390ee9739f91e3640ae9b","tier":null,"role":"viewer"},{"type":"individual","id":"4dda46c7d7c3e7b9","login":"cstokes","name":"Chase Stokes","avatar_url":"https://avatars-next.observableusercontent.com/f06b126b52c399f68942c78749fce999945a6e1e0679fb71f276d8202cc4bda4","tier":null,"role":"viewer"},{"type":"individual","id":"72baf632a0418d59","login":"mahviz","name":"Marti Hearst","avatar_url":"https://avatars-next.observableusercontent.com/b48154abf5d0c76e7a5c6ca5f7032830743967a233eda6c73877193b70a218a3","tier":null,"role":"viewer"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"MULHOLLAND_IAN","cells":[{"id":0,"value":"# MULHOLLAND_IAN","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":936,"value":"## Visualization That Answers Many Questions in a Constrained Space","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":7,"value":"## 1. Exploratory Data Analysis\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":131,"value":"### 1.1 Load the Data\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":10,"value":"Let's begin by loading the data.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":14,"value":"// First, I'm going to load the data as a dataframe called data\ndata = FileAttachment(\"CO2_data@1.csv\").csv({typed: true})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":133,"value":"### 1.2 Data Distribution\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":137,"value":"Next, I'm going to insert the data directly into the notebook since Observable creates a summary table automatically","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":45,"value":"co2_data2 = await FileAttachment(\"CO2_data@2.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"co2_data2","database":"$undefined"},{"id":143,"value":"Awesome. I found a file from Observable that has a summary table function to make this summary data a bit clearer. Let's import the file and then pass our data through that function.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":18,"value":"import {SummaryTable} from \"@observablehq/summary-table\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":37,"value":"SummaryTable(data)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":241,"value":"I find the histograms to be a bit difficult to read - I'm going to split these out into separate graphs below.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":243,"value":"### Frequency of Weeks Ahead Purchased","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":230,"value":"Plot.plot({\n marks: [\n Plot.rectY(data, Plot.binX({y: \"count\"}, {x: \"WeeksAheadPurchased\"})),\n Plot.ruleY([0])\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":246,"value":"### Frequency of CO2 Grams per Passenger","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":234,"value":"Plot.plot({\n marks: [\n Plot.rectY(data, Plot.binX({y: \"count\", interval: 40}, {x: \"CO2InKGramsPerPassenger\"})),\n Plot.ruleY([0])\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":249,"value":"### Frequency of Travel Time (Minutes)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":233,"value":"Plot.plot({\n marks: [\n Plot.rectY(data, Plot.binX({y: \"count\", interval: 50}, {x: \"TravelTimeMinutes\"})),\n Plot.ruleY([0])\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":252,"value":"### Frequency of Ticket Price (Euros)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":239,"value":"Plot.plot({\n marks: [\n Plot.rectY(data, Plot.binX({y: \"count\", interval: 10}, {x: \"TicketPriceEuros\"})),\n Plot.ruleY([0])\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":450,"value":"*(Sidenote): I'm having way too much fun with Observable - here's an interactive distribution widget that's more fun than these static histograms!*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":454,"value":"viewof column_name = Inputs.select(data.columns)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":452,"value":" Plot.dot(data, {x: column_name, fill: \"black\", fillOpacity: 0.2}).plot()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":255,"value":"#### Findings","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":258,"value":"From these initial descriptive visualizations, we found that:\n- Weeks ahead of purchase is evenly distributed across the dataset - but price has the largest variance. This could be an interesting relationship to look at.\n- Travel time also has a bimodal distribution - I'm interested in seeing why.\n\nLet's continue exploring some interesting relationships.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":147,"value":"### 1.3 Relationships within the Data\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":75,"value":"Great, now that we have a sense of what's in the data, let's take a look at what relationships might exist.\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":83,"value":"viewof reducer = Inputs.radio([\"mean\", \"min\", \"max\", \"deviation\", \"sum\"], {\n value: \"mean\", \n label: \"Summary statistic (reducer):\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":93,"value":"### Travel Time by Route","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":86,"value":"Plot.plot({\n marks: [\n Plot.barX(\n data,\n Plot.groupY(\n { x: reducer},\n { x: \"TravelTimeMinutes\", y: \"Route\", fill: \"coral\",sort: { y: \"x\", reverse: true } }\n )\n )\n ],\n marginLeft: 125\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":104,"value":"viewof reducer2 = Inputs.radio([\"mean\", \"min\", \"max\", \"deviation\", \"sum\"], {\n value: \"mean\", \n label: \"Summary statistic (reducer):\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":108,"value":"### CO2 by Route","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":101,"value":"Plot.plot({\n marks: [\n Plot.barX(\n data,\n Plot.groupY(\n { x: reducer2},\n { x: \"CO2InKGramsPerPassenger\", y: \"Route\", fill: \"#93E9BE\",sort: { y: \"x\", reverse: true } }\n )\n )\n ],\n marginLeft: 125\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":119,"value":"viewof reducer3 = Inputs.radio([\"mean\", \"min\", \"max\", \"deviation\", \"sum\"], {\n value: \"mean\", \n label: \"Summary statistic (reducer):\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":123,"value":"### Ticket Price by Route","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":115,"value":"Plot.plot({\n marks: [\n Plot.barX(\n data,\n Plot.groupY(\n { x: reducer3},\n { x: \"TicketPriceEuros\", y: \"Route\", fill: \"coral\",sort: { y: \"x\", reverse: true } }\n )\n )\n ],\n marginLeft: 125\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":158,"value":"viewof reducer4 = Inputs.radio([\"mean\", \"min\", \"max\", \"deviation\", \"sum\"], {\n value: \"mean\", \n label: \"Summary statistic (reducer):\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":162,"value":"### CO2 by Mode","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":149,"value":"Plot.plot({\n marks: [\n Plot.barX(\n data,\n Plot.groupY(\n { x: reducer4},\n { x: \"CO2InKGramsPerPassenger\", y: \"Mode\", fill: \"#93E9BE\", sort: { y: \"x\", reverse: true } }\n )\n )\n ],\n marginLeft: 125\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":174,"value":"### Ticket Price by Mode","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":171,"value":"Plot.plot({\n marks: [\n Plot.barX(\n data,\n Plot.groupY(\n { x: reducer4},\n { x: \"TicketPriceEuros\", y: \"Mode\", fill: \"coral\",sort: { y: \"x\", reverse: true } }\n )\n )\n ],\n marginLeft: 125\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":178,"value":"#### Findings","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":166,"value":"From these relationships, we found that:\n- the mode of transport that have the highest CO2 emissions are also the most expensive.\n- On average, the longest time in minutes, also result in higher CO2 emissions.\n- However, the routes with the most expensive prices aren't the highest in CO2 emissions.\n\nLet's continue exploring our data before we purpose a visual design.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":332,"value":"### Average CO2 by Mode for each route ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":274,"value":"Plot.plot({\n height: 800,\n marginLeft: 110,\n marginRight: 110,\n grid: true,\n x: {nice: true},\n y: {inset: 5},\n color: {type: \"categorical\"},\n facet: {data: data, y: \"Route\", marginRight: 90},\n marks: [\n Plot.frame(),\n Plot.dot(data, {\n x: \"CO2InKGramsPerPassenger\",\n y: \"Mode\",\n stroke: \"Mode\",\n sort: {\n y: {value: \"x\", reduce: \"mean\", reverse: true},\n fy: {value: \"x\", reduce: \"mean\", reverse: true}\n }\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":351,"value":"### CO2 by Travel Time ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":181,"value":"// question 1a\nPlot.plot({\n x: {\n //domain: [7, 10],\n line: true,\n label: \"Travel Time\",\n labelAnchor: \"center\"\n },\n y: {\n //domain:[0, 1000],\n label: \"CO2 (Grams / Passenger)\",\n labelAnchor: \"center\"\n },\n color: {\n legend: true,\n label: \"Legend\",\n width: 350,\n ticks: 4\n },\n marks: [\n Plot.dot(\n data, \n {x: \"TravelTimeMinutes\", \n y: \"CO2InKGramsPerPassenger\",\n fill: \"Mode\"\n }\n ),\n \n Plot.linearRegressionY(\n data, \n {x: \"TravelTimeMinutes\", \n y: \"CO2InKGramsPerPassenger\"\n }\n ),\n Plot.text(data, \n {x: \"TravelTimeMinutes\", \n y: \"CO2InKGramsPerPassenger\", \n text: \"Route\",\n dx: 10,\n textAnchor: \"start\"\n }) \n ],\n marginBottom: 35\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":362,"value":"Cool, one other relationship that may be interesting is to see how price is affected by when a ticket is purchased.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":364,"value":"### Ticket Prices by Weeks Purchased","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":212,"value":"// question 1a\nPlot.plot({\n x: {\n //domain: [7, 10],\n line: true,\n label: \"Weeks Ahead Purchased\",\n labelAnchor: \"center\"\n },\n y: {\n //domain:[0, 1000],\n label: \"Price (Euros)\",\n labelAnchor: \"center\"\n },\n marks: [\n Plot.dot(\n data, \n {x: \"WeeksAheadPurchased\", \n y: \"TicketPriceEuros\",\n }\n ),\n \n Plot.linearRegressionY(\n data, \n {x: \"WeeksAheadPurchased\", \n y: \"TicketPriceEuros\"\n }\n ),\n Plot.text(data, \n {x: \"WeeksAheadPurchased\", \n y: \"TicketPriceEuros\", \n text: \"Mode\",\n dx: 10,\n textAnchor: \"start\"\n }) \n ],\n marginBottom: 35\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":369,"value":"Finally, let's take a look between how price and CO2 emissions are related.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":372,"value":"### Ticket Prices by Weeks Purchased","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":374,"value":"// question 1a\nPlot.plot({\n x: {\n //domain: [7, 10],\n line: true,\n label: \"Price (Euros)\",\n labelAnchor: \"center\"\n },\n y: {\n //domain:[0, 1000],\n label: \"CO2 (Grams / Passenger)\",\n labelAnchor: \"center\"\n },\n color: {\n legend: true,\n label: \"Legend\",\n width: 350,\n ticks: 4\n },\n marks: [\n Plot.dot(\n data, \n {x: \"TicketPriceEuros\", \n y: \"CO2InKGramsPerPassenger\",\n fill: \"Mode\"\n }\n ),\n \n Plot.linearRegressionY(\n data, \n {x: \"TicketPriceEuros\", \n y: \"CO2InKGramsPerPassenger\"\n }\n ),\n Plot.text(data, \n {x: \"TicketPriceEuros\", \n y: \"CO2InKGramsPerPassenger\", \n text: \"Mode\",\n dx: 10,\n textAnchor: \"start\"\n }) \n ],\n marginBottom: 35\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":356,"value":"#### Findings","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":358,"value":"From these relationships, we found that:\n- There is a negative relationship between CO2 emissions and time traveled.\n- There is a *slight* negative relationship between date purchased and ticket price.\n- There's not really a relationship between price and CO2 emissions.\n- From our first two graphs, we see that plane travel accounts for a lot more CO2 emission than train.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":392,"value":"One question I have from this data exploration, is what is the most \"efficient\" (i.e. lowest price, shortest time, and lowest amount of CO2 emissions). We might do this in a graph below which also allows user input to the price that they would be willing to pay. The results would show the method and the route that could be taken.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":389,"value":"### Travel Time by CO2 / Passenger","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":318,"value":"viewof filterLimit = Inputs.range([0, 415\n ], \n {step: 1,\n value: 102,\n label: \"Ticket Price\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":316,"value":"Plot.plot({\n marks: [\n Plot.ruleY([filterLimit]),\n Plot.dot(data, {\n x: \"CO2InKGramsPerPassenger\",\n y: \"TravelTimeMinutes\",\n fill: \"Mode\",\n text: \"Route\"\n }),\n Plot.text(data, {\n filter: (d) => d.TicketPriceEuros > filterLimit,\n x: \"CO2InKGramsPerPassenger\",\n y: \"TravelTimeMinutes\",\n fill: \"Mode\",\n text: \"Route\",\n dx: -10,\n textAnchor: \"end\"\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":397,"value":"## 2. Design and Description of Visualization\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":402,"value":"### 2.1 Design Sketches\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":440,"value":"#### Complete Visual Sketch\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":438,"value":"img_9241 = FileAttachment(\"IMG_9241.jpg\").image()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":448,"value":"**Goal**: The overall goal of this design is to help people decide when, where, how, and if they should travel. I'd like to show the overall efficiency (defined by cost and time per Euro) of travel so people can validate whether the costs are worth the trip. I'd also like to show when people should buy their ticket for travel.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":442,"value":"#### What is the most efficient holiday getaway? Sketch\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":436,"value":"img_9237 = FileAttachment(\"IMG_9237.jpg\").image()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":445,"value":"#### When should you buy your ticket? Sketch\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":437,"value":"img_9240 = FileAttachment(\"IMG_9240.jpg\").image()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":404,"value":"### 2.2 Inititial Goals and Description of Visual\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":646,"value":"Throughout the exploration exercise, I imagined three tradeoffs that potential travelers would need to weigh before making a decision on where and how to travel. The costs that I imagined were in terms of time, money, and impact on the climate.\n\nI imagined this visual as a resource within the larger context of an article or piece, rather than standalone piece. I thought this data could help potential travelers answer the question: ***What is the most optimal trip in terms of time, money, and climate impact?***\n\nAdditionally, whenever I'm traveling, I'm always worried about tickets going higher if I wait too long or dropping after I book my trip. I thought that another question that could help travelers answer another question: ***When is the most optimal time to buy a ticket?***","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":407,"value":"### 2.3 Comments from Student Feedback","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":643,"value":"$45","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":650,"value":"### 2.4 Initial Design in Observable","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":663,"value":"*Please note: This is not the final design, this is a draft to see how the design would look before integrating feedback*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":506,"value":"//First I'm going to transform my data. I'm going to find the average CO2 emissions and Time dividing by Price for each route\ntransformedData = data.map(d => ({\n Route: d.Route,\n Mode: d.Mode,\n CO2PerEuro: d.CO2InKGramsPerPassenger / d.TicketPriceEuros,\n TimePerEuro: d.TravelTimeMinutes / d.TicketPriceEuros\n}))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":577,"value":"// Then I'm going to separate the data into \"Train\" and \"Plan\" (I couldn't figure out an easier way to group them by Route and Mode! :( )\n\n//Here I'll start with Train\n\ntransformedDataTrain = transformedData.filter(d => d.Mode === \"Train\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":583,"value":"//And I'll do the same for Plane\n\ntransformedDataPlane = transformedData.filter(d => d.Mode === \"Plane\")\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":564,"value":"//Next, I'm going to group the data by the Route\n// We'll start with Train\n\ngroupedDataTrain = transformedDataTrain.reduce((acc, current) => {\n const route = current.Route;\n if (!acc[route]) {\n acc[route] = {\n Route: route,\n CO2PerEuro: [],\n TimePerEuro: []\n };\n }\n acc[route].CO2PerEuro.push(current.CO2PerEuro);\n acc[route].TimePerEuro.push(current.TimePerEuro);\n return acc;\n}, {})\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":589,"value":"//And group for Plane\n\ngroupedDataPlane = transformedDataPlane.reduce((acc, current) => {\n const route = current.Route;\n if (!acc[route]) {\n acc[route] = {\n Route: route,\n CO2PerEuro: [],\n TimePerEuro: []\n };\n }\n acc[route].CO2PerEuro.push(current.CO2PerEuro);\n acc[route].TimePerEuro.push(current.TimePerEuro);\n return acc;\n}, {})\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":568,"value":"// And finally I'm going to average the values by Route. We'll start with Train!\navgDataTrain = Object.values(groupedDataTrain).map(group => ({\n Route: group.Route,\n CO2PerEuro: group.CO2PerEuro.reduce((sum, val) => sum + val) / group.CO2PerEuro.length,\n TimePerEuro: group.TimePerEuro.reduce((sum, val) => sum + val) / group.TimePerEuro.length\n}));","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":593,"value":"// We'll move on to Plane! And now we're ready to plot!\navgDataPlane = Object.values(groupedDataPlane).map(group => ({\n Route: group.Route,\n CO2PerEuro: group.CO2PerEuro.reduce((sum, val) => sum + val) / group.CO2PerEuro.length,\n TimePerEuro: group.TimePerEuro.reduce((sum, val) => sum + val) / group.TimePerEuro.length\n}));","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":504,"value":"//And now we're ready to plot! Let's start with plotting the train data\navgTrain = Plot.plot({\n x: {\n domain: [0, 12],\n line: true,\n label: \"Average Time (Minutes) per Euro\",\n labelAnchor: \"center\"\n },\n y: {\n domain: [0, 2],\n label: \"Average CO2 (KGrams) per Euro\",\n labelAnchor: \"center\",\n grid: true,\n\n },\n marks: [\n Plot.dot(\n avgDataTrain, \n {x: \"TimePerEuro\", \n y: \"CO2PerEuro\",\n fill: d => d[\"TimePerEuro\"] < 4 && d[\"CO2PerEuro\"] < 4 ? \"coral\" : \"gray\"\n }\n ),\n Plot.text(avgDataTrain, \n {x: \"TimePerEuro\", \n y: \"CO2PerEuro\", \n text: \"Route\",\n dx: 10,\n textAnchor: \"start\",\n }) \n ],\n marginBottom: 35,\n marginRight: 100\n})\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":604,"value":"//Let's move on to plotting the plane data\navgPlane = Plot.plot({\n x: {\n domain: [0, 5],\n line: true,\n label: \"Average Time (Minutes) per Euro\",\n labelAnchor: \"center\"\n },\n y: {\n domain: [0, 10],\n label: \"Average CO2 (KGrams) per Euro\",\n labelAnchor: \"center\",\n grid: true,\n\n },\n marks: [\n Plot.dot(\n avgDataPlane, \n {x: \"TimePerEuro\", \n y: \"CO2PerEuro\",\n fill: d => d[\"TimePerEuro\"] < 4 && d[\"CO2PerEuro\"] < 4 ? \"#93E9BE\" : \"gray\"\n }\n ),\n Plot.text(avgDataPlane, \n {x: \"TimePerEuro\", \n y: \"CO2PerEuro\", \n text: \"Route\",\n dx: 10,\n textAnchor: \"start\",\n }) \n ],\n marginBottom: 35,\n marginRight: 100\n})\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":492,"value":"ticketPriceWeek = \nPlot.plot({\n x: {\n tickRotate: -90,\n insetLeft: 10,\n grid: true,\n domain: data.WeeksAheadPurchased\n },\n facet: {\n data: data,\n x: \"WeeksAheadPurchased\",\n marginRight: 70 \n },\n fx: {\n tickFormat: d3.WeeksAheadPurchased\n },\n marks: [\n Plot.barY(\n data, \n Plot.groupX(\n {\n y: \"mean\"\n },\n {\n x: \"Mode\",\n y: \"TicketPriceEuros\",\n fill: \"Mode\"\n }\n )\n ),\n ],\n width: 900,\n height: 400,\n marginBottom: 90\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":460,"value":"Let's set up our constrained space","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":417,"value":"$46","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":669,"value":"### 2.5 Reflections and Moving Forward","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":676,"value":"### 2.5.1 Self-Assessment","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":672,"value":"$47","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":679,"value":"### 2.5.2 Reflections","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":930,"value":"I completely agree that the concepts of the time per Euro and CO2 per passenger per Euro are complicated concepts to communicate in a graph. I think the question was interesting, but the data and visualization doesn't necessarily communicate this concept very well. After making a first draft in Observable, the labels are really difficult to read and jumbled - while it shows trends that planes and trains are grouped, the axises are a bit misleading. I think simplifying my charts here will be more effective than risking misleading or unclear visualization.\n\nI also don't know why I chose to use a bar chart for time series data! I am having trouble comparing my own data across weeks - the comparison only works within each week. I'll likely expand this into a line chart.\n\nI also think that having some sort of aid, whether visual to text, is a really important attribute in telling the story of the data I am trying to show. I plan on integrating a text summary of each graph as well.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":399,"value":"## 3. Final Visualization, Goals, and Reflection\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":462,"value":"### 3.1 Visualizations","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":849,"value":"I'm going to start by making my CO2 graph a bit similar. I'm going to create a stacked bar chart comparing CO2 per passenger for each route by train and plane.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":683,"value":"co2ByRouteChart = Plot.plot({\n color: {legend: true},\n marks: [\n Plot.barX(\n data,\n Plot.groupY(\n { x: \"mean\" },\n { x: \"CO2InKGramsPerPassenger\", y: \"Route\", \n sort: { y: \"x\", reverse: true }, \n fill: (d) => d[\"Mode\"] == \"Plane\" ? \"#385E72\" : \"#E57F84\",\n }\n )\n )\n ],\n marginLeft: 150\n}) \n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":921,"value":"travelTimeByRouteChart = Plot.plot({\n color: {legend: true},\n marks: [\n Plot.barX(\n data,\n Plot.groupY(\n { x: \"mean\" },\n { x: \"TravelTimeMinutes\", y: \"Route\", \n sort: { y: \"x\", reverse: true }, \n fill: (d) => d[\"Mode\"] == \"Plane\" ? \"#385E72\" : \"#E57F84\",\n }\n )\n )\n ],\n marginLeft: 150\n}) \n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":784,"value":"travelTimeByRouteChart2 = Plot.plot({\n x: {\n tickRotate: 45,\n insetLeft: 5\n },\n grid: true,\n height: 320,\n color: {\n legend: true\n },\n\n marks: [\n Plot.frame(),\n Plot.dot(data, {x: \"Route\", \n y: \"TravelTimeMinutes\", \n text: \"TravelTimeMinutes\",\n fill: (d) => d[\"Mode\"] == \"Plane\" ? \"#385E72\" : \"#E57F84\",\n r: 3})\n ],\n marginBottom: 100\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":851,"value":"Ok next I'm going to simplify my comparison of prices over time. I think this might be better to transform into a line graph. \n\nI'm going to start by transforming the data to find the average ticket price by Mode by WeeksAheadPurchased.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":791,"value":"// Let's first create an array of all the TicketPriceEuros values for each combination of Mode and WeeksAheadPurchased.\n\ntransformedArray = data.reduce((acc, item) => {\n const key = `${item.WeeksAheadPurchased}-${item.Mode}`;\n if (!acc[key]) {\n acc[key] = {\n WeeksAheadPurchased: item.WeeksAheadPurchased,\n Mode: item.Mode,\n TicketPriceEuros: []\n };\n }\n\n acc[key].TicketPriceEuros.push(item.TicketPriceEuros);\n\n return acc;\n}, {})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":793,"value":"// Let's now create an array of the average Ticket Price for each Mode and each Week.\n\naverageTicketPrices = Object.values(transformedArray).map(group => ({\n WeeksAheadPurchased: group.WeeksAheadPurchased,\n Mode: group.Mode,\n averageTicketPrice: group.TicketPriceEuros.reduce((sum, price) => sum + price, 0) / group.TicketPriceEuros.length\n}))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":819,"value":"//I separated the averageTicketPrices into Plane and Train to help make graphing a little easier.\n\naverageTicketPricesPlane = averageTicketPrices.filter(d => d.Mode === \"Plane\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":824,"value":"averageTicketPricesTrain = averageTicketPrices.filter(d => d.Mode === \"Train\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":807,"value":"averageTicketPriceChart = Plot.plot({\n x: {\n grid: true,\n label: \"Weeks Ahead of Purchase\",\n autorange: 'reversed',\n labelAnchor: \"center\"\n },\n y: {\n grid: true,\n domain: [0,200],\n label: \"↑ Average Ticket Price\"\n },\n marks: [\n Plot.line(\n averageTicketPricesPlane,\n {\n x: \"WeeksAheadPurchased\",\n y: \"averageTicketPrice\",\n stroke: \"#385E72\"\n }),\n Plot.line(\n averageTicketPricesTrain,\n {\n x: \"WeeksAheadPurchased\",\n y: \"averageTicketPrice\",\n stroke: \"#E57F84\"\n })\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":473,"value":"// My legends disappeared, so I found this article to help create one separately https://observablehq.com/@observablehq/plot-legends\n\nalpha = Plot.legend({\n color: {\n domain: [\"Plane\",\"Train\"],\n fill: (d) => d[\"Mode\"] == \"Plane\" ? \"#385E72\" : \"#E57F84\"\n },\n legend: \"swatches\",\n className: \"alphabet\",\n swatchSize: 5,\n style: {\n fontSize: \"5px\"\n }\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":887,"value":"// My legends disappeared, so I found this article to help create one separately https://observablehq.com/@observablehq/plot-legends\n\nalpha1 = Plot.legend({\n color: {\n domain: [\"Plane\",\"Train\"],\n fill: (d) => d[\"Mode\"] == \"Plane\" ? \"#385E72\" : \"#E57F84\"\n },\n legend: \"swatches\",\n className: \"alphabet\",\n swatchSize: 5,\n style: {\n fontSize: \"5px\"\n }\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":890,"value":"// My legends disappeared, so I found this article to help create one separately https://observablehq.com/@observablehq/plot-legends\n\nalpha2 = Plot.legend({\n color: {\n domain: [\"Plane\",\"Train\"],\n fill: [\"#385E72\", \"#E57F84\"]\n },\n legend: \"swatches\",\n className: \"alphabet\",\n swatchSize: 5,\n style: {\n fontSize: \"5px\"\n }\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":867,"value":"### 3.2 Container SVG","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":866,"value":"$48","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":909,"value":"### 3.3 Goal of Visualization","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":919,"value":"$49","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1001,"value":"### 3.4 Omissions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1000,"value":"Of course, no design is perfect and there were omissions that had to be made in a constrained, static space. My largest constraint in my original design was the overwhelming number and position of labels for each data point. This made the chart really difficult to read and to decipher the main learnings from my graph. I would have liked to include labels in my second iteration, but also struggled with the size and placement. Another omission was a lack of text and context to the charts. I would've liked to include a small write-up and summary of the graphs I used in the visual. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":912,"value":"### 3.5 Final Reflections","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":927,"value":"$4a","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"}],"files":"$W4b","stdlib":"1"}} 44:"$43:body"