working on hw 5
This commit is contained in:
@@ -1,5 +0,0 @@
|
||||
<component name="InspectionProjectProfileManager">
|
||||
<settings>
|
||||
<option name="PROJECT_PROFILE" />
|
||||
</settings>
|
||||
</component>
|
||||
12
hw5/.idea/hw5.iml
generated
Normal file
12
hw5/.idea/hw5.iml
generated
Normal file
@@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module type="WEB_MODULE" version="4">
|
||||
<component name="NewModuleRootManager">
|
||||
<content url="file://$MODULE_DIR$">
|
||||
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/temp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/tmp" />
|
||||
</content>
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
6
hw5/.idea/misc.xml
generated
Normal file
6
hw5/.idea/misc.xml
generated
Normal file
@@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="JavaScriptSettings">
|
||||
<option name="languageLevel" value="ES6" />
|
||||
</component>
|
||||
</project>
|
||||
8
hw5/.idea/modules.xml
generated
Normal file
8
hw5/.idea/modules.xml
generated
Normal file
@@ -0,0 +1,8 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ProjectModuleManager">
|
||||
<modules>
|
||||
<module fileurl="file://$PROJECT_DIR$/.idea/hw5.iml" filepath="$PROJECT_DIR$/.idea/hw5.iml" />
|
||||
</modules>
|
||||
</component>
|
||||
</project>
|
||||
6
hw5/.idea/vcs.xml
generated
Normal file
6
hw5/.idea/vcs.xml
generated
Normal file
@@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="$PROJECT_DIR$/.." vcs="Git" />
|
||||
</component>
|
||||
</project>
|
||||
259
hw5/.idea/workspace.xml
generated
Normal file
259
hw5/.idea/workspace.xml
generated
Normal file
@@ -0,0 +1,259 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ChangeListManager">
|
||||
<list default="true" id="ec571783-3e54-46a9-b309-b5622228ca95" name="Default Changelist" comment="">
|
||||
<change afterPath="$PROJECT_DIR$/.idea/vcs.xml" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/../hw4/.idea/inspectionProfiles/profiles_settings.xml" beforeDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/../hw4/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/../hw4/.idea/workspace.xml" afterDir="false" />
|
||||
</list>
|
||||
<ignored path="$PROJECT_DIR$/.tmp/" />
|
||||
<ignored path="$PROJECT_DIR$/temp/" />
|
||||
<ignored path="$PROJECT_DIR$/tmp/" />
|
||||
<option name="EXCLUDED_CONVERTED_TO_IGNORED" value="true" />
|
||||
<option name="SHOW_DIALOG" value="false" />
|
||||
<option name="HIGHLIGHT_CONFLICTS" value="true" />
|
||||
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
|
||||
<option name="LAST_RESOLUTION" value="IGNORE" />
|
||||
</component>
|
||||
<component name="FUSProjectUsageTrigger">
|
||||
<session id="-961252385">
|
||||
<usages-collector id="statistics.lifecycle.project">
|
||||
<counts>
|
||||
<entry key="project.closed" value="1" />
|
||||
<entry key="project.open.time.5" value="1" />
|
||||
<entry key="project.opened" value="1" />
|
||||
</counts>
|
||||
</usages-collector>
|
||||
<usages-collector id="statistics.file.extensions.open">
|
||||
<counts>
|
||||
<entry key="css" value="1" />
|
||||
<entry key="html" value="2" />
|
||||
<entry key="js" value="5" />
|
||||
</counts>
|
||||
</usages-collector>
|
||||
<usages-collector id="statistics.file.types.open">
|
||||
<counts>
|
||||
<entry key="CSS" value="1" />
|
||||
<entry key="HTML" value="2" />
|
||||
<entry key="JavaScript" value="5" />
|
||||
</counts>
|
||||
</usages-collector>
|
||||
<usages-collector id="statistics.file.extensions.edit">
|
||||
<counts>
|
||||
<entry key="html" value="56" />
|
||||
<entry key="js" value="1759" />
|
||||
</counts>
|
||||
</usages-collector>
|
||||
<usages-collector id="statistics.file.types.edit">
|
||||
<counts>
|
||||
<entry key="HTML" value="56" />
|
||||
<entry key="JavaScript" value="1759" />
|
||||
</counts>
|
||||
</usages-collector>
|
||||
</session>
|
||||
</component>
|
||||
<component name="FileEditorManager">
|
||||
<leaf>
|
||||
<file pinned="false" current-in-tab="false">
|
||||
<entry file="file://$PROJECT_DIR$/js/script.js">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="330">
|
||||
<caret line="22" column="10" selection-start-line="22" selection-start-column="10" selection-end-line="22" selection-end-column="10" />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
</file>
|
||||
<file pinned="false" current-in-tab="false">
|
||||
<entry file="file://$PROJECT_DIR$/js/tree.js">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="352">
|
||||
<caret line="47" lean-forward="true" selection-end-line="47" />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
</file>
|
||||
<file pinned="false" current-in-tab="false">
|
||||
<entry file="file://$PROJECT_DIR$/js/table.js">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="314">
|
||||
<caret line="171" column="44" selection-start-line="171" selection-start-column="39" selection-end-line="171" selection-end-column="44" />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
</file>
|
||||
<file pinned="false" current-in-tab="true">
|
||||
<entry file="file://$PROJECT_DIR$/hw5.html">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="146">
|
||||
<caret line="27" column="18" lean-forward="true" selection-start-line="27" selection-start-column="14" selection-end-line="27" selection-end-column="18" />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
</file>
|
||||
</leaf>
|
||||
</component>
|
||||
<component name="FindInProjectRecents">
|
||||
<findStrings>
|
||||
<find>console.log</find>
|
||||
<find>tr</find>
|
||||
</findStrings>
|
||||
</component>
|
||||
<component name="Git.Settings">
|
||||
<option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$/.." />
|
||||
</component>
|
||||
<component name="IdeDocumentHistory">
|
||||
<option name="CHANGED_PATHS">
|
||||
<list>
|
||||
<option value="$PROJECT_DIR$/hw5.html" />
|
||||
<option value="$PROJECT_DIR$/js/script.js" />
|
||||
<option value="$PROJECT_DIR$/js/tree.js" />
|
||||
<option value="$PROJECT_DIR$/js/table.js" />
|
||||
</list>
|
||||
</option>
|
||||
</component>
|
||||
<component name="JsBuildToolGruntFileManager" detection-done="true" sorting="DEFINITION_ORDER" />
|
||||
<component name="JsBuildToolPackageJson" detection-done="true" sorting="DEFINITION_ORDER" />
|
||||
<component name="JsGulpfileManager">
|
||||
<detection-done>true</detection-done>
|
||||
<sorting>DEFINITION_ORDER</sorting>
|
||||
</component>
|
||||
<component name="ProjectFrameBounds">
|
||||
<option name="y" value="23" />
|
||||
<option name="width" value="1280" />
|
||||
<option name="height" value="731" />
|
||||
</component>
|
||||
<component name="ProjectLevelVcsManager" settingsEditedManually="true" />
|
||||
<component name="ProjectView">
|
||||
<navigator proportions="" version="1">
|
||||
<foldersAlwaysOnTop value="true" />
|
||||
</navigator>
|
||||
<panes>
|
||||
<pane id="Scope" />
|
||||
<pane id="ProjectPane">
|
||||
<subPane>
|
||||
<expand>
|
||||
<path>
|
||||
<item name="hw5" type="b2602c69:ProjectViewProjectNode" />
|
||||
<item name="hw5" type="462c0819:PsiDirectoryNode" />
|
||||
</path>
|
||||
<path>
|
||||
<item name="hw5" type="b2602c69:ProjectViewProjectNode" />
|
||||
<item name="hw5" type="462c0819:PsiDirectoryNode" />
|
||||
<item name="js" type="462c0819:PsiDirectoryNode" />
|
||||
</path>
|
||||
</expand>
|
||||
<select />
|
||||
</subPane>
|
||||
</pane>
|
||||
</panes>
|
||||
</component>
|
||||
<component name="PropertiesComponent">
|
||||
<property name="WebServerToolWindowFactoryState" value="false" />
|
||||
<property name="last_opened_file_path" value="$PROJECT_DIR$" />
|
||||
<property name="nodejs_interpreter_path.stuck_in_default_project" value="undefined stuck path" />
|
||||
<property name="nodejs_npm_path_reset_for_default_project" value="true" />
|
||||
</component>
|
||||
<component name="RunDashboard">
|
||||
<option name="ruleStates">
|
||||
<list>
|
||||
<RuleState>
|
||||
<option name="name" value="ConfigurationTypeDashboardGroupingRule" />
|
||||
</RuleState>
|
||||
<RuleState>
|
||||
<option name="name" value="StatusDashboardGroupingRule" />
|
||||
</RuleState>
|
||||
</list>
|
||||
</option>
|
||||
</component>
|
||||
<component name="SvnConfiguration">
|
||||
<configuration />
|
||||
</component>
|
||||
<component name="TaskManager">
|
||||
<task active="true" id="Default" summary="Default task">
|
||||
<changelist id="ec571783-3e54-46a9-b309-b5622228ca95" name="Default Changelist" comment="" />
|
||||
<created>1571014353493</created>
|
||||
<option name="number" value="Default" />
|
||||
<option name="presentableId" value="Default" />
|
||||
<updated>1571014353493</updated>
|
||||
<workItem from="1571014357425" duration="12401000" />
|
||||
</task>
|
||||
<servers />
|
||||
</component>
|
||||
<component name="TimeTrackingManager">
|
||||
<option name="totallyTimeSpent" value="12401000" />
|
||||
</component>
|
||||
<component name="TodoView">
|
||||
<todo-panel id="selected-file">
|
||||
<is-autoscroll-to-source value="true" />
|
||||
</todo-panel>
|
||||
<todo-panel id="all">
|
||||
<are-packages-shown value="true" />
|
||||
<is-autoscroll-to-source value="true" />
|
||||
</todo-panel>
|
||||
</component>
|
||||
<component name="ToolWindowManager">
|
||||
<frame x="0" y="23" width="1280" height="731" extended-state="0" />
|
||||
<editor active="true" />
|
||||
<layout>
|
||||
<window_info id="Favorites" side_tool="true" />
|
||||
<window_info active="true" content_ui="combo" id="Project" order="0" visible="true" weight="0.2494043" />
|
||||
<window_info id="Structure" order="1" side_tool="true" weight="0.25" />
|
||||
<window_info anchor="bottom" id="Docker" show_stripe_button="false" />
|
||||
<window_info anchor="bottom" id="Version Control" show_stripe_button="false" />
|
||||
<window_info anchor="bottom" id="Terminal" />
|
||||
<window_info anchor="bottom" id="Event Log" side_tool="true" />
|
||||
<window_info anchor="bottom" id="Message" order="0" />
|
||||
<window_info anchor="bottom" id="Find" order="1" />
|
||||
<window_info anchor="bottom" id="Run" order="2" />
|
||||
<window_info anchor="bottom" id="Debug" order="3" weight="0.4" />
|
||||
<window_info anchor="bottom" id="Cvs" order="4" weight="0.25" />
|
||||
<window_info anchor="bottom" id="Inspection" order="5" weight="0.4" />
|
||||
<window_info anchor="bottom" id="TODO" order="6" visible="true" weight="0.3286385" />
|
||||
<window_info anchor="right" id="Commander" internal_type="SLIDING" order="0" type="SLIDING" weight="0.4" />
|
||||
<window_info anchor="right" id="Ant Build" order="1" weight="0.25" />
|
||||
<window_info anchor="right" content_ui="combo" id="Hierarchy" order="2" weight="0.25" />
|
||||
</layout>
|
||||
</component>
|
||||
<component name="TypeScriptGeneratedFilesManager">
|
||||
<option name="version" value="1" />
|
||||
</component>
|
||||
<component name="VcsContentAnnotationSettings">
|
||||
<option name="myLimit" value="2678400000" />
|
||||
</component>
|
||||
<component name="editorHistoryManager">
|
||||
<entry file="file://$PROJECT_DIR$/d3.js">
|
||||
<provider selected="true" editor-type-id="text-editor" />
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/styles.css">
|
||||
<provider selected="true" editor-type-id="text-editor" />
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/js/tree.js">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="352">
|
||||
<caret line="47" lean-forward="true" selection-end-line="47" />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/js/script.js">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="330">
|
||||
<caret line="22" column="10" selection-start-line="22" selection-start-column="10" selection-end-line="22" selection-end-column="10" />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/js/table.js">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="314">
|
||||
<caret line="171" column="44" selection-start-line="171" selection-start-column="39" selection-end-line="171" selection-end-column="44" />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/hw5.html">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="146">
|
||||
<caret line="27" column="18" lean-forward="true" selection-start-line="27" selection-start-column="14" selection-end-line="27" selection-end-column="18" />
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
</component>
|
||||
</project>
|
||||
BIN
hw5/assets/aller.ttf
Executable file
BIN
hw5/assets/aller.ttf
Executable file
Binary file not shown.
BIN
hw5/assets/brasil_cup_font.otf
Executable file
BIN
hw5/assets/brasil_cup_font.otf
Executable file
Binary file not shown.
BIN
hw5/assets/fifa_brazil_logo.jpg
Executable file
BIN
hw5/assets/fifa_brazil_logo.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 142 KiB |
129
hw5/data/fifa-matches.csv
Executable file
129
hw5/data/fifa-matches.csv
Executable file
@@ -0,0 +1,129 @@
|
||||
Team,Opponent,Goals Made,Goals Conceded,Delta Goals,Wins,Losses,Result
|
||||
Brazil,Germany,1,7,-6,0,1,Semi Finals
|
||||
Germany,Argentina,1,0,1,1,0,Winner
|
||||
Argentina,Netherlands,0,0,0,1,0,Semi Finals
|
||||
Netherlands,Brazil,3,0,3,1,0,Fourth Place
|
||||
Brazil,Colombia,2,1,1,1,0,Quarter Finals
|
||||
France,Germany,0,1,-1,0,1,Quarter Finals
|
||||
Netherlands,Mexico,2,1,1,1,0,Round of Sixteen
|
||||
CostaRica,Greece,1,1,0,1,0,Round of Sixteen
|
||||
Argentina,Switzerland,1,0,1,1,0,Round of Sixteen
|
||||
Belgium,UnitedStates,2,1,1,1,0,Round of Sixteen
|
||||
Netherlands,CostaRica,0,0,0,1,0,Quarter Finals
|
||||
Argentina,Belgium,1,0,1,1,0,Quarter Finals
|
||||
Netherlands,Argentina,0,0,0,0,1,Semi Finals
|
||||
Brazil,Netherlands,0,3,-3,0,1,Third Place
|
||||
Chile,Brazil,1,1,0,0,1,Round of Sixteen
|
||||
Uruguay,Colombia,0,2,-2,0,1,Round of Sixteen
|
||||
Nigeria,France,0,2,-2,0,1,Round of Sixteen
|
||||
Algeria,Germany,1,2,-1,0,1,Round of Sixteen
|
||||
Colombia,Brazil,1,2,-1,0,1,Quarter Finals
|
||||
Germany,France,1,0,1,1,0,Quarter Finals
|
||||
Germany,Brazil,7,1,6,1,0,Semi Finals
|
||||
Argentina,Germany,0,1,-1,0,1,Runner-Up
|
||||
Mexico,Netherlands,1,2,-1,0,1,Round of Sixteen
|
||||
Greece,CostaRica,1,1,0,0,1,Round of Sixteen
|
||||
Switzerland,Argentina,0,1,-1,0,1,Round of Sixteen
|
||||
UnitedStates,Belgium,1,2,-1,0,1,Round of Sixteen
|
||||
CostaRica,Netherlands,0,0,0,0,1,Quarter Finals
|
||||
Belgium,Argentina,0,1,-1,0,1,Quarter Finals
|
||||
Brazil,Chile,1,1,0,1,0,Round of Sixteen
|
||||
Colombia,Uruguay,2,0,2,1,0,Round of Sixteen
|
||||
France,Nigeria,2,0,2,1,0,Round of Sixteen
|
||||
Germany,Algeria,2,1,1,1,0,Round of Sixteen
|
||||
Brazil,Croatia,3,1,2,1,0,Group
|
||||
Mexico,Cameroon,1,0,1,1,0,Group
|
||||
Spain,Netherlands,1,5,-4,0,1,Group
|
||||
Chile,Australia,3,1,2,1,0,Group
|
||||
Colombia,Greece,3,0,3,1,0,Group
|
||||
Uruguay,CostaRica,1,3,-2,0,1,Group
|
||||
England,Italy,1,2,-1,0,1,Group
|
||||
CotedIvoire,Japan,2,1,1,1,0,Group
|
||||
Switzerland,Ecuador,2,1,1,1,0,Group
|
||||
France,Honduras,3,0,3,1,0,Group
|
||||
Argentina,Bosnia,2,1,1,1,0,Group
|
||||
Germany,Portugal,4,0,4,1,0,Group
|
||||
Iran,Nigeria,0,0,0,0,0,Group
|
||||
Ghana,UnitedStates,1,2,-1,0,1,Group
|
||||
Belgium,Algeria,2,1,1,1,0,Group
|
||||
Brazil,Mexico,0,0,0,0,0,Group
|
||||
Russia,Korea,1,1,0,0,0,Group
|
||||
Australia,Netherlands,2,3,-1,0,1,Group
|
||||
Spain,Chile,0,2,-2,0,1,Group
|
||||
Cameroon,Croatia,0,4,-4,0,1,Group
|
||||
Colombia,CotedIvoire,2,1,1,1,0,Group
|
||||
Uruguay,England,2,1,1,1,0,Group
|
||||
Japan,Greece,0,0,0,0,0,Group
|
||||
Italy,CostaRica,0,1,-1,0,1,Group
|
||||
Switzerland,France,2,5,-3,0,1,Group
|
||||
Honduras,Ecuador,1,2,-1,0,1,Group
|
||||
Argentina,Iran,1,0,1,1,0,Group
|
||||
Germany,Ghana,2,2,0,0,0,Group
|
||||
Nigeria,Bosnia,1,0,1,1,0,Group
|
||||
Belgium,Russia,1,0,1,1,0,Group
|
||||
Korea,Algeria,2,4,-2,0,1,Group
|
||||
UnitedStates,Portugal,2,2,0,0,0,Group
|
||||
Australia,Spain,0,3,-3,0,1,Group
|
||||
Netherlands,Chile,2,0,2,1,0,Group
|
||||
Cameroon,Brazil,1,4,-3,0,1,Group
|
||||
Croatia,Mexico,1,3,-2,0,1,Group
|
||||
Italy,Uruguay,0,1,-1,0,1,Group
|
||||
CostaRica,England,0,0,0,0,0,Group
|
||||
Japan,Colombia,1,4,-3,0,1,Group
|
||||
Greece,CotedIvoire,2,1,1,1,0,Group
|
||||
Nigeria,Argentina,2,3,-1,0,1,Group
|
||||
Bosnia,Iran,3,1,2,1,0,Group
|
||||
Honduras,Switzerland,0,3,-3,0,1,Group
|
||||
Ecuador,France,0,0,0,0,0,Group
|
||||
UnitedStates,Germany,0,1,-1,0,1,Group
|
||||
Portugal,Ghana,2,1,1,1,0,Group
|
||||
Korea,Belgium,0,1,-1,0,1,Group
|
||||
Algeria,Russia,1,1,0,0,0,Group
|
||||
Croatia,Brazil,1,3,-2,0,1,Group
|
||||
Cameroon,Mexico,0,1,-1,0,1,Group
|
||||
Netherlands,Spain,5,1,4,1,0,Group
|
||||
Australia,Chile,1,3,-2,0,1,Group
|
||||
Greece,Colombia,0,3,-3,0,1,Group
|
||||
CostaRica,Uruguay,3,1,2,1,0,Group
|
||||
Italy,England,2,1,1,1,0,Group
|
||||
Japan,CotedIvoire,1,2,-1,0,1,Group
|
||||
Ecuador,Switzerland,1,2,-1,0,1,Group
|
||||
Honduras,France,0,3,-3,0,1,Group
|
||||
Bosnia,Argentina,1,2,-1,0,1,Group
|
||||
Portugal,Germany,0,4,-4,0,1,Group
|
||||
Nigeria,Iran,0,0,0,0,0,Group
|
||||
UnitedStates,Ghana,2,1,1,1,0,Group
|
||||
Algeria,Belgium,1,2,-1,0,1,Group
|
||||
Mexico,Brazil,0,0,0,0,0,Group
|
||||
Korea,Russia,1,1,0,0,0,Group
|
||||
Netherlands,Australia,3,2,1,1,0,Group
|
||||
Chile,Spain,2,0,2,1,0,Group
|
||||
Croatia,Cameroon,4,0,4,1,0,Group
|
||||
CotedIvoire,Colombia,1,2,-1,0,1,Group
|
||||
England,Uruguay,1,2,-1,0,1,Group
|
||||
Greece,Japan,0,0,0,0,0,Group
|
||||
CostaRica,Italy,1,0,1,1,0,Group
|
||||
France,Switzerland,5,2,3,1,0,Group
|
||||
Ecuador,Honduras,2,1,1,1,0,Group
|
||||
Iran,Argentina,0,1,-1,0,1,Group
|
||||
Ghana,Germany,2,2,0,0,0,Group
|
||||
Bosnia,Nigeria,0,1,-1,0,1,Group
|
||||
Russia,Belgium,0,1,-1,0,1,Group
|
||||
Algeria,Korea,4,2,2,1,0,Group
|
||||
Portugal,UnitedStates,2,2,0,0,0,Group
|
||||
Spain,Australia,3,0,3,1,0,Group
|
||||
Chile,Netherlands,0,2,-2,0,1,Group
|
||||
Brazil,Cameroon,4,1,3,1,0,Group
|
||||
Mexico,Croatia,3,1,2,1,0,Group
|
||||
Uruguay,Italy,1,0,1,1,0,Group
|
||||
England,CostaRica,0,0,0,0,0,Group
|
||||
Colombia,Japan,4,1,3,1,0,Group
|
||||
CotedIvoire,Greece,1,2,-1,0,1,Group
|
||||
Argentina,Nigeria,3,2,1,1,0,Group
|
||||
Iran,Bosnia,1,3,-2,0,1,Group
|
||||
Switzerland,Honduras,3,0,3,1,0,Group
|
||||
France,Ecuador,0,0,0,0,0,Group
|
||||
Germany,UnitedStates,1,0,1,1,0,Group
|
||||
Ghana,Portugal,1,2,-1,0,1,Group
|
||||
Belgium,Korea,1,0,1,1,0,Group
|
||||
Russia,Algeria,1,1,0,0,0,Group
|
||||
|
1953
hw5/data/fifa-matches.json
Executable file
1953
hw5/data/fifa-matches.json
Executable file
File diff suppressed because it is too large
Load Diff
32
hw5/data/fifa-tree.csv
Executable file
32
hw5/data/fifa-tree.csv
Executable file
@@ -0,0 +1,32 @@
|
||||
Team,Opponent,Wins,Losses,ParentGame
|
||||
Brazil,Chile,1,0,4
|
||||
Colombia,Uruguay,1,0,15
|
||||
France,Nigeria,1,0,5
|
||||
Germany,Algeria,1,0,16
|
||||
Brazil,Colombia,1,0,6
|
||||
France,Germany,0,1,17
|
||||
Brazil,Germany,0,1,7
|
||||
Germany,Argentina,1,0,26
|
||||
Netherlands,Mexico,1,0,12
|
||||
CostaRica,Greece,1,0,22
|
||||
Argentina,Switzerland,1,0,13
|
||||
Belgium,UnitedStates,1,0,23
|
||||
Netherlands,CostaRica,1,0,14
|
||||
Argentina,Belgium,1,0,24
|
||||
Netherlands,Argentina,0,1,25
|
||||
Colombia,Brazil,0,1,6
|
||||
Germany,France,1,0,17
|
||||
Germany,Brazil,1,0,7
|
||||
Mexico,Netherlands,0,1,12
|
||||
Greece,CostaRica,0,1,22
|
||||
Switzerland,Argentina,0,1,13
|
||||
UnitedStates,Belgium,0,1,23
|
||||
CostaRica,Netherlands,0,1,14
|
||||
Belgium,Argentina,0,1,24
|
||||
Argentina,Netherlands,1,0,25
|
||||
Argentina,Germany,0,1,26
|
||||
Germany,,1,0,
|
||||
Nigeria,France,0,1,5
|
||||
Algeria,Germany,0,1,16
|
||||
Uruguay,Colombia,0,1,15
|
||||
Chile,Brazil,0,1,4
|
||||
|
61
hw5/hw5.html
Executable file
61
hw5/hw5.html
Executable file
@@ -0,0 +1,61 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Visualization - Homework 5 - Exploring the 2014 World Coup </title>
|
||||
<link rel="stylesheet" href="styles.css"/>
|
||||
<!--script src="https://d3js.org/d3.v4.js"></script-->
|
||||
<script src="d3.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div class="container">
|
||||
<header>
|
||||
<img src="assets/fifa_brazil_logo.jpg" alt="Brazil WC Russia Logo" id="logo"/>
|
||||
<h1>Exploring Match Statistics for 2014 World Cup CS 5890 Homework</h1>
|
||||
<div>Name: Brady Bodily; E-Mail: brady.bodily1@aggiemail.usu.edu; UID: A00987897</div>
|
||||
</header>
|
||||
|
||||
|
||||
<div class="view">
|
||||
<h2>Score Table</h2>
|
||||
|
||||
<table id="matchTable">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Team</th>
|
||||
<td style="text-align:center"> Goals <span class="glyphicon glyphicon-sort"></span><br/></td>
|
||||
<td>Round/Result</td>
|
||||
<td>Wins</td>
|
||||
<td>Losses</td>
|
||||
<td>Total Games</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td id="goalHeader"></td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</div>
|
||||
<div class="view">
|
||||
|
||||
|
||||
<h2>Second Stage</h2>
|
||||
<svg width="500" height="900">
|
||||
<g id="tree"></g>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!--<script type="application/javascript" src="load_hacker.js"></script>-->
|
||||
<script type="application/javascript" src="js/tree.js"></script>
|
||||
<script type="application/javascript" src="js/table.js"></script>
|
||||
<script type="application/javascript" src="js/script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
42
hw5/js/script.js
Normal file
42
hw5/js/script.js
Normal file
@@ -0,0 +1,42 @@
|
||||
// Loads in the table information from fifa-matches.json
|
||||
d3.json('data/fifa-matches.json').then(function(data) {
|
||||
//console.log(data);
|
||||
|
||||
// Loads in the tree information from fifa-tree.csv and calls
|
||||
// createTree(csvData) to render the tree.
|
||||
d3.csv("data/fifa-tree.csv").then(function(csvData) {
|
||||
//console.log(csvData);
|
||||
|
||||
//Create a unique "id" field for each game
|
||||
csvData.forEach(function (d, i) {
|
||||
d.id = d.Team + d.Opponent + i;
|
||||
});
|
||||
|
||||
//Create Tree Object
|
||||
let tree = new Tree();
|
||||
tree.createTree(csvData);
|
||||
|
||||
// Create Table Object and pass in reference to tree object
|
||||
// (for hover linking)
|
||||
let table = new Table(data,tree);
|
||||
|
||||
table.createTable();
|
||||
table.updateTable();
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
// //************************* HACKER VERSION *****************************
|
||||
// // Loads in fifa-matches.csv file, aggregates the data into the correct
|
||||
// // format, then calls the appropriate functions to create and populate
|
||||
// // the table.
|
||||
// d3.csv("data/fifa-matches.csv", function (error, matchesCSV) {
|
||||
|
||||
// // Loads in the tree information from fifa-tree.csv and calls
|
||||
// // createTree(csvData) to render the tree.
|
||||
// d3.csv("data/fifa-tree.csv", function (error, treeCSV) {
|
||||
// // ******* TODO: PART I *******
|
||||
// });
|
||||
// });
|
||||
// //*********************** END HACKER VERSION ***************************
|
||||
199
hw5/js/table.js
Normal file
199
hw5/js/table.js
Normal file
@@ -0,0 +1,199 @@
|
||||
/** Class implementing the table. */
|
||||
class Table {
|
||||
/**
|
||||
* Creates a Table Object
|
||||
*/
|
||||
constructor(teamData, treeObject) {
|
||||
|
||||
// Maintain reference to the tree Object;
|
||||
console.log(treeObject);
|
||||
this.tree = treeObject;
|
||||
|
||||
// Create list of all elements that will populate the table
|
||||
// Initially, the tableElements will be identical to the teamData
|
||||
this.tableElements = teamData.slice(0); //
|
||||
|
||||
// Store all match data for the 2014 Fifa cup
|
||||
this.teamData = teamData;
|
||||
|
||||
// Default values for the Table Headers
|
||||
this.tableHeaders = ["Delta Goals", "Result", "Wins", "Losses", "TotalGames"];
|
||||
|
||||
// To be used when sizing the svgs in the table cells.
|
||||
this.cell = {
|
||||
"width": 70,
|
||||
"height": 20,
|
||||
"buffer": 15
|
||||
};
|
||||
|
||||
this.bar = {
|
||||
"height": 20
|
||||
};
|
||||
|
||||
// Set variables for commonly accessed data columns
|
||||
this.goalsMadeHeader = 'Goals Made';
|
||||
this.goalsConcededHeader = 'Goals Conceded';
|
||||
|
||||
// Setup the scales
|
||||
this.goalScale = null;
|
||||
|
||||
// Used for games/wins/losses
|
||||
this.gameScale = null;
|
||||
|
||||
// Color scales
|
||||
// For aggregate columns Use colors '#ece2f0', '#016450' for the range.
|
||||
this.aggregateColorScale = null;
|
||||
|
||||
// For goal Column. Use colors '#cb181d', '#034e7b' for the range.
|
||||
this.goalColorScale = null;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Creates a table skeleton including headers that when clicked allow
|
||||
* you to sort the table by the chosen attribute.
|
||||
* Also calculates aggregate values of goals, wins, losses and total
|
||||
* games as a function of country.
|
||||
*/
|
||||
createTable() {
|
||||
let teamData = this.teamData;
|
||||
|
||||
// ******* TODO: PART II *******
|
||||
|
||||
// Update Scale Domains
|
||||
this.goalScale = d3.scaleLinear()
|
||||
.domain([d3.min(teamData, d => d.value['Goals Made']), d3.max(teamData, d => d.value['Goals Made'])])
|
||||
.range([0,2*this.cell.width])
|
||||
.nice();
|
||||
this.aggregateColorScale = d3.scaleLinear()
|
||||
.domain([0, d3.max(teamData, d => d.value['TotalGames'])])
|
||||
.range(["#ece2f0","#016450"])
|
||||
this.gameScale = d3.scaleLinear()
|
||||
.domain([0, d3.max(teamData, d => d.value['TotalGames'])])
|
||||
.range([0,this.cell.width]);
|
||||
|
||||
|
||||
// Create the x axes for the goalScale.
|
||||
let goalAxis = d3.axisTop();
|
||||
goalAxis.scale(this.goalScale);
|
||||
// Add GoalAxis to header of col 1.
|
||||
d3.select("#goalHeader").append('svg')
|
||||
.attr('width', 2 * this.cell.width + 2 * this.cell.buffer)
|
||||
.attr('height', this.cell.height)
|
||||
.append('g')
|
||||
.attr("transform", "translate(10,16)")
|
||||
.call(goalAxis)
|
||||
|
||||
// ******* TODO: PART V *******
|
||||
|
||||
// Set sorting callback for clicking on headers
|
||||
|
||||
// Clicking on headers should also trigger collapseList() and
|
||||
// updateTable().
|
||||
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Updates the table contents with a row for each element in the global
|
||||
* variable tableElements.
|
||||
*/
|
||||
updateTable() {
|
||||
// ******* TODO: PART III *******
|
||||
// Create table rows
|
||||
console.log(this.tableElements);
|
||||
let row = d3.select('#tbody')
|
||||
.selectAll('tr')
|
||||
.data(this.tableElements);
|
||||
row.exit()
|
||||
.remove();
|
||||
row.enter()
|
||||
.append('tr')
|
||||
.on('click', (d,i) =>{
|
||||
this.tree.updateTree(this.tableElements[i]);
|
||||
})
|
||||
.on('mouseover', (d,i) => {
|
||||
this.tree.updateTree(this.tableElements[i]);
|
||||
})
|
||||
.on('mouseout', () => {
|
||||
this.tree.clearTree();
|
||||
})
|
||||
.merge(row);
|
||||
// Append th elements for the Team Names
|
||||
let tableHeader = row.selectAll('th')
|
||||
.data((d)=>{
|
||||
return [{'type':d.value['type'],
|
||||
'view': 'text',
|
||||
'data': d.key()}]
|
||||
});
|
||||
tableHeader.exit()
|
||||
.remove();
|
||||
tableHeader = tableHeader.enter()
|
||||
.append('th')
|
||||
.merge(tableHeader);
|
||||
|
||||
|
||||
|
||||
// Append td elements for the remaining columns.
|
||||
let tcell = tableHeader.selectAll('#td')
|
||||
.data(d => {
|
||||
return[{'type': d.value['type'], 'view': 'goals', 'value': {'goalsMade':d.value['Goals Made'], 'goalsConceded':d.value['Goals Conceded']}},
|
||||
{'type': d.value['type'], 'view': 'text', 'value': d.value['Result']},
|
||||
{'type': d.value['type'], 'view': 'bar', 'value': d.value['Wins']},
|
||||
{'type': d.value['type'], 'view': 'bar', 'value': d.value['Losses']},
|
||||
{'type': d.value['type'], 'view': 'bar', 'value': d.value['TotalGames']}
|
||||
] });
|
||||
tcell.exit().remove();
|
||||
tcell = tcell.enter().append('td').merge(tcell);
|
||||
// Data for each cell is of the type: {'type':<'game' or 'aggregate'>,
|
||||
// 'value':<[array of 1 or two elements]>}
|
||||
tableHeader.text(d =>{
|
||||
return d.type === 'aggregate' ? d.value : "x"+d.value
|
||||
})
|
||||
.style('color', d => {
|
||||
return d.type === 'aggregate' ? 'black' : 'grey'
|
||||
});
|
||||
//Add scores as title property to appear on hover
|
||||
|
||||
//Populate cells (do one type of cell at a time)
|
||||
let values = tcell.each(d=> { console.log(d.view); return [d.view === 'goals', d.view === 'bar', d.view ==='text']});
|
||||
let goals = tcell.filter(d =>{return d.view === 'goals'});
|
||||
let bar = values[1];
|
||||
let text = tcell.filter(d =>{return d.view === 'text'});
|
||||
console.log(this.cell);
|
||||
|
||||
text.select('svg').remove();
|
||||
let textBody = text.append('svg')
|
||||
.attr("width", this.cell.width*1.6)
|
||||
.attr("height", this.cell.height);
|
||||
textBody.append("text")
|
||||
.attr("x", 0)
|
||||
.attr("y", this.cell.height/2)
|
||||
.text(d => { return d.value['label']});
|
||||
|
||||
//Create diagrams in the goals column
|
||||
|
||||
//Set the color of all games that tied to light gray
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Updates the global tableElements variable, with a row for each row
|
||||
* to be rendered in the table.
|
||||
*/
|
||||
updateList(i) {
|
||||
// ******* TODO: PART IV *******
|
||||
|
||||
// Only update list for aggregate clicks, not game clicks
|
||||
}
|
||||
|
||||
/**
|
||||
* Collapses all expanded countries, leaving only rows for aggregate
|
||||
* values per country.
|
||||
*/
|
||||
collapseList() {
|
||||
|
||||
// ******* TODO: PART IV *******
|
||||
|
||||
}
|
||||
}
|
||||
47
hw5/js/tree.js
Normal file
47
hw5/js/tree.js
Normal file
@@ -0,0 +1,47 @@
|
||||
/** Class implementing the tree view. */
|
||||
class Tree {
|
||||
/**
|
||||
* Creates a Tree Object
|
||||
*/
|
||||
constructor() {
|
||||
}
|
||||
|
||||
/**
|
||||
* Creates a node/edge structure and renders a tree layout based on
|
||||
* the input data
|
||||
*
|
||||
* @param treeData an array of objects that contain parent/child
|
||||
* information.
|
||||
*/
|
||||
createTree(treeData) {
|
||||
|
||||
// ******* TODO: PART VI *******
|
||||
|
||||
// Create a tree and give it a size() of 800 by 300.
|
||||
|
||||
// Create a root for the tree using d3.stratify();
|
||||
|
||||
// Add nodes and links to the tree.
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Updates the highlighting in the tree based on the selected team.
|
||||
* Highlights the appropriate team nodes and labels.
|
||||
*
|
||||
* @param row a string specifying which team was selected in the table.
|
||||
*/
|
||||
updateTree(row) {
|
||||
// ******* TODO: PART VII *******
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Removes all highlighting from the tree.
|
||||
*/
|
||||
clearTree() {
|
||||
// ******* TODO: PART VII *******
|
||||
|
||||
// You only need two lines of code for this! No loops!
|
||||
}
|
||||
}
|
||||
155
hw5/styles.css
Executable file
155
hw5/styles.css
Executable file
@@ -0,0 +1,155 @@
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
font: 14px sans-serif;
|
||||
/*width: 720px;*/
|
||||
}
|
||||
|
||||
th {
|
||||
font-weight: normal;
|
||||
text-align: right;
|
||||
padding-right: 6px;
|
||||
min-width: 125px;
|
||||
}
|
||||
|
||||
thead td , th{
|
||||
cursor: s-resize;
|
||||
}
|
||||
|
||||
tbody tr:first-child td {
|
||||
padding-top: 2px;
|
||||
}
|
||||
|
||||
tbody th{
|
||||
cursor:pointer;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.aggregate{
|
||||
color: #317f19;
|
||||
}
|
||||
|
||||
.game{
|
||||
color: #b1b1b1;
|
||||
}
|
||||
|
||||
tbody td {
|
||||
padding-right: 5px;
|
||||
padding-left: 5px;
|
||||
border-left: solid 1px #000;
|
||||
color:black
|
||||
}
|
||||
|
||||
tbody tr:hover {
|
||||
background-color: #dbdbdb;
|
||||
}
|
||||
|
||||
tbody tr .game {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
/*tbody tr .game:hover {*/
|
||||
/*background-color: #dbdbdb;*/
|
||||
/*}*/
|
||||
|
||||
.label{
|
||||
fill: #ffffff;
|
||||
font: 14px sans-serif;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'aller';
|
||||
src: url('assets/aller.ttf');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family:'brazil';
|
||||
src: url('assets/brasil_cup_font.otf');
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin-top: 0;
|
||||
font-family: 'brazil';
|
||||
color: #317f19;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: 'brazil';
|
||||
color: #317f19;
|
||||
padding-bottom: 0;
|
||||
margin-top: 3px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
h3 {
|
||||
padding-bottom: 0px;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
* {
|
||||
font-family: 'aller';
|
||||
}
|
||||
|
||||
header {
|
||||
padding: 0.5em;
|
||||
/*clear: left;*/
|
||||
text-align: center;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
#logo {
|
||||
float: right;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.goalBar{
|
||||
opacity:0.6;
|
||||
}
|
||||
|
||||
.goalCircle{
|
||||
stroke-width: 3px;
|
||||
r:5;
|
||||
}
|
||||
|
||||
|
||||
.node circle {
|
||||
fill: #be2714;
|
||||
}
|
||||
|
||||
.node text {
|
||||
font: 14px sans-serif;
|
||||
}
|
||||
|
||||
.winner circle {
|
||||
fill: #364e74;
|
||||
}
|
||||
|
||||
.loser text {
|
||||
text-shadow: 0 1px 0 #fff, 0 -1px 0 #fff, 1px 0 0 #fff, -1px 0 0 #fff;
|
||||
}
|
||||
|
||||
.link {
|
||||
fill: none;
|
||||
stroke: #555;
|
||||
stroke-opacity: 0.4;
|
||||
stroke-width: 2px;
|
||||
}
|
||||
|
||||
.selected {
|
||||
stroke: #be2714;
|
||||
stroke-width: 4px;
|
||||
}
|
||||
|
||||
.selectedLabel {
|
||||
fill: #be2714;
|
||||
font-weight: bolder;
|
||||
|
||||
}
|
||||
|
||||
.view {
|
||||
width: 650px;
|
||||
padding: 0.5em;
|
||||
float: left;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user