diff --git a/src/main/java/seng302/controllers/CanvasController.java b/src/main/java/seng302/controllers/CanvasController.java
index 033598ec..2e00b8f1 100644
--- a/src/main/java/seng302/controllers/CanvasController.java
+++ b/src/main/java/seng302/controllers/CanvasController.java
@@ -13,6 +13,7 @@ import javafx.scene.canvas.GraphicsContext;
 import javafx.scene.layout.AnchorPane;
 import javafx.scene.layout.Pane;
 import javafx.scene.paint.Color;
+import javafx.scene.text.Text;
 import javafx.util.Duration;
 import seng302.models.Boat;
 import seng302.models.Event;
@@ -22,6 +23,8 @@ import seng302.models.mark.GateMark;
 import seng302.models.mark.Mark;
 import seng302.models.mark.MarkType;
 import seng302.models.mark.SingleMark;
+import seng302.models.parsers.ConfigParser;
+import seng302.models.parsers.CourseParser;
 
 import java.io.IOException;
 import java.util.ArrayList;
@@ -47,6 +50,8 @@ public class CanvasController {
 
     @FXML
     private AnchorPane contentAnchorPane;
+    @FXML
+    private Text windArrowText, windDirectionText;
 
     private void loadRaceResultView() {
         FXMLLoader loader = new FXMLLoader(getClass().getResource("/FinishView.fxml"));
@@ -104,6 +109,11 @@ public class CanvasController {
         }
 
         maxTimeline.setOnFinished(event -> loadRaceResultView());
+
+        //set wind direction!!!!!!! can't find another place to put my code --haoming
+        double windDirection = new ConfigParser("doc/examples/config.xml").getWindDirection();
+        windDirectionText.setText(String.format("%.1f°", windDirection));
+        windArrowText.setRotate(windDirection);
     }
 
     /**
diff --git a/src/main/resources/RaceView.fxml b/src/main/resources/RaceView.fxml
index e658a8bf..4a726873 100644
--- a/src/main/resources/RaceView.fxml
+++ b/src/main/resources/RaceView.fxml
@@ -1,5 +1,7 @@
 <?xml version="1.0" encoding="UTF-8"?>
 
+<?import javafx.scene.text.*?>
+<?import javafx.scene.shape.*?>
 <?import javafx.scene.control.*?>
 <?import java.lang.*?>
 <?import javafx.scene.canvas.*?>
@@ -18,7 +20,7 @@
     <RowConstraints minHeight="10.0" prefHeight="320.0" vgrow="SOMETIMES" />
   </rowConstraints>
    <children>
-      <AnchorPane maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" prefHeight="960.0" prefWidth="1280.0" style="-fx-background-color: lightblue;" GridPane.columnIndex="1" GridPane.rowSpan="3" fx:id="contentAnchorPane">
+      <AnchorPane fx:id="contentAnchorPane" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" prefHeight="960.0" prefWidth="1280.0" style="-fx-background-color: lightblue;" GridPane.columnIndex="1" GridPane.rowSpan="3">
          <children>
             <Canvas fx:id="canvas" height="960.0" style="-fx-background-color: Aqua;" width="1007.0" />
          </children>
@@ -33,6 +35,17 @@
             <Button layoutX="18.0" layoutY="468.0" mnemonicParsing="false" text="Button" />
             <TextArea editable="false" layoutX="11.0" layoutY="640.0" prefHeight="306.0" prefWidth="200.0" />
             <TextArea editable="false" layoutX="11.0" layoutY="280.0" prefHeight="141.0" prefWidth="200.0" />
+            <Circle fx:id="windBackgroundCircle" blendMode="DARKEN" fill="#76baf8" layoutX="110.0" layoutY="166.0" radius="35.0" stroke="#686868" strokeType="INSIDE" strokeWidth="3.0" />
+            <Text fx:id="windArrowText" fill="#686868" layoutX="86.0" layoutY="186.0" strokeType="OUTSIDE" strokeWidth="0.0" text="↑">
+               <font>
+                  <Font name="AdobeArabic-Regular" size="55.0" />
+               </font>
+            </Text>
+            <Text fx:id="windDirectionText" fill="#a8a7a7" layoutX="171.0" layoutY="214.0" strokeType="OUTSIDE" strokeWidth="0.0" text="0.0°" textAlignment="RIGHT">
+               <font>
+                  <Font name="System Bold" size="13.0" />
+               </font>
+            </Text>
          </children>
       </AnchorPane>
    </children>