diff --git a/public/main.js b/public/main.js
index d4b73307bcdb86331305056c8bf40a8cb56d2296..19a28d3b3dc4405ea70a60b911bf49776ef6b59b 100644
--- a/public/main.js
+++ b/public/main.js
@@ -6886,7 +6886,7 @@ var $author$project$Main$Smartphone = function (id) {
 							return function (ir_blaster) {
 								return function (processor_name) {
 									return function (processor_brand) {
-										return function (num_cors) {
+										return function (num_cores) {
 											return function (processor_speed) {
 												return function (battery) {
 													return function (fast_charging) {
@@ -6898,7 +6898,7 @@ var $author$project$Main$Smartphone = function (id) {
 																			return function (camera) {
 																				return function (card) {
 																					return function (os) {
-																						return {battery: battery, brand: brand, camera: camera, card: card, fast_charging: fast_charging, g5: g5, id: id, ir_blaster: ir_blaster, memory: memory, model: model, nfc: nfc, num_cors: num_cors, os: os, price: price, processor_brand: processor_brand, processor_name: processor_name, processor_speed: processor_speed, ram: ram, rating: rating, refresh_rate: refresh_rate, resolution: resolution, screen_size: screen_size};
+																						return {battery: battery, brand: brand, camera: camera, card: card, fast_charging: fast_charging, g5: g5, id: id, ir_blaster: ir_blaster, memory: memory, model: model, nfc: nfc, num_cores: num_cores, os: os, price: price, processor_brand: processor_brand, processor_name: processor_name, processor_speed: processor_speed, ram: ram, rating: rating, refresh_rate: refresh_rate, resolution: resolution, screen_size: screen_size};
 																					};
 																				};
 																			};
@@ -7454,40 +7454,65 @@ var $author$project$Main$parseCSV = function (csv) {
 };
 var $author$project$Main$update = F2(
 	function (msg, model) {
-		if (msg.$ === 'FetchData') {
-			return _Utils_Tuple2(model, $author$project$Main$fetchData);
-		} else {
-			if (msg.a.$ === 'Ok') {
-				var csvData = msg.a.a;
-				var parsedData = $author$project$Main$parseCSV(csvData);
-				if (parsedData.$ === 'Ok') {
-					var data = parsedData.a;
+		switch (msg.$) {
+			case 'FetchData':
+				return _Utils_Tuple2(model, $author$project$Main$fetchData);
+			case 'DataReceived':
+				if (msg.a.$ === 'Ok') {
+					var csvData = msg.a.a;
+					var parsedData = $author$project$Main$parseCSV(csvData);
+					if (parsedData.$ === 'Ok') {
+						var data = parsedData.a;
+						return _Utils_Tuple2(
+							_Utils_update(
+								model,
+								{csvdata: csvData, data: data, error: $elm$core$Maybe$Nothing}),
+							$elm$core$Platform$Cmd$none);
+					} else {
+						return _Utils_Tuple2(
+							_Utils_update(
+								model,
+								{
+									error: $elm$core$Maybe$Just('Failed to parse CSV data')
+								}),
+							$elm$core$Platform$Cmd$none);
+					}
+				} else {
 					return _Utils_Tuple2(
 						_Utils_update(
 							model,
-							{csvdata: csvData, data: data, error: $elm$core$Maybe$Nothing}),
+							{
+								error: $elm$core$Maybe$Just('Failed to load data')
+							}),
+						$elm$core$Platform$Cmd$none);
+				}
+			default:
+				if (msg.a.$ === 'ChangeText1') {
+					var _v2 = msg.a;
+					return _Utils_Tuple2(
+						_Utils_update(
+							model,
+							{csvdata: 'Text1'}),
 						$elm$core$Platform$Cmd$none);
 				} else {
+					var _v3 = msg.a;
 					return _Utils_Tuple2(
 						_Utils_update(
 							model,
-							{
-								error: $elm$core$Maybe$Just('Failed to parse CSV data')
-							}),
+							{csvdata: 'Text2'}),
 						$elm$core$Platform$Cmd$none);
 				}
-			} else {
-				return _Utils_Tuple2(
-					_Utils_update(
-						model,
-						{
-							error: $elm$core$Maybe$Just('Failed to load data')
-						}),
-					$elm$core$Platform$Cmd$none);
-			}
 		}
 	});
+var $author$project$Main$ScatterplotMsg = function (a) {
+	return {$: 'ScatterplotMsg', a: a};
+};
 var $elm$html$Html$div = _VirtualDom_node('div');
+var $elm$virtual_dom$VirtualDom$map = _VirtualDom_map;
+var $elm$html$Html$map = $elm$virtual_dom$VirtualDom$map;
+var $author$project$Scatterplot$ChangeText1 = {$: 'ChangeText1'};
+var $author$project$Scatterplot$ChangeText2 = {$: 'ChangeText2'};
+var $elm$html$Html$button = _VirtualDom_node('button');
 var $author$project$Scatterplot$XyData = F3(
 	function (xDescription, yDescription, data) {
 		return {data: data, xDescription: xDescription, yDescription: yDescription};
@@ -7532,6 +7557,23 @@ var $author$project$Scatterplot$filterSmartphones = function (smartphoneList) {
 	var filteredSmartphones = A2($elm$core$List$filterMap, $author$project$Scatterplot$mapToPoint, smartphoneList);
 	return A3($author$project$Scatterplot$XyData, 'price', 'memory', filteredSmartphones);
 };
+var $elm$virtual_dom$VirtualDom$Normal = function (a) {
+	return {$: 'Normal', a: a};
+};
+var $elm$virtual_dom$VirtualDom$on = _VirtualDom_on;
+var $elm$html$Html$Events$on = F2(
+	function (event, decoder) {
+		return A2(
+			$elm$virtual_dom$VirtualDom$on,
+			event,
+			$elm$virtual_dom$VirtualDom$Normal(decoder));
+	});
+var $elm$html$Html$Events$onClick = function (msg) {
+	return A2(
+		$elm$html$Html$Events$on,
+		'click',
+		$elm$json$Json$Decode$succeed(msg));
+};
 var $elm_community$typed_svg$TypedSvg$Types$AnchorMiddle = {$: 'AnchorMiddle'};
 var $elm_community$typed_svg$TypedSvg$Types$Percent = function (a) {
 	return {$: 'Percent', a: a};
@@ -8648,7 +8690,28 @@ var $author$project$Scatterplot$viewScatterplot = function (model) {
 		_List_Nil,
 		_List_fromArray(
 			[
-				$author$project$Scatterplot$scatterplot(filteredSmartphoneData)
+				A2(
+				$elm$html$Html$button,
+				_List_fromArray(
+					[
+						$elm$html$Html$Events$onClick($author$project$Scatterplot$ChangeText1)
+					]),
+				_List_fromArray(
+					[
+						$elm$html$Html$text('Text1')
+					])),
+				A2(
+				$elm$html$Html$button,
+				_List_fromArray(
+					[
+						$elm$html$Html$Events$onClick($author$project$Scatterplot$ChangeText2)
+					]),
+				_List_fromArray(
+					[
+						$elm$html$Html$text('Text2')
+					])),
+				$author$project$Scatterplot$scatterplot(filteredSmartphoneData),
+				$elm$html$Html$text(model.csvdata)
 			]));
 };
 var $author$project$Main$view = function (model) {
@@ -8657,7 +8720,10 @@ var $author$project$Main$view = function (model) {
 		_List_Nil,
 		_List_fromArray(
 			[
-				$author$project$Scatterplot$viewScatterplot(model)
+				A2(
+				$elm$html$Html$map,
+				$author$project$Main$ScatterplotMsg,
+				$author$project$Scatterplot$viewScatterplot(model))
 			]));
 };
 var $author$project$Main$main = $elm$browser$Browser$element(
diff --git a/src/Main.elm b/src/Main.elm
index ba887705a9d9b9babf5c631874919d92206cf1a0..22d238e933227ea9eee5984b9f7ad521381f9285 100644
--- a/src/Main.elm
+++ b/src/Main.elm
@@ -5,7 +5,7 @@ import Csv.Decode as Decode exposing (Decoder)
 import Html exposing (Html, div)
 import Http
 import Result exposing (Result(..))
-import Scatterplot exposing (viewScatterplot)
+import Scatterplot exposing (Msg(..))
 
 
 
@@ -32,7 +32,7 @@ type alias Smartphone =
     , ir_blaster : Maybe Bool
     , processor_name : Maybe String
     , processor_brand : Maybe String
-    , num_cors : Maybe Float
+    , num_cores : Maybe Float
     , processor_speed : Maybe Float
     , battery : Maybe Float
     , fast_charging : Maybe Float
@@ -66,6 +66,7 @@ init _ =
 type Msg
     = FetchData
     | DataReceived (Result Http.Error String)
+    | ScatterplotMsg Scatterplot.Msg
 
 
 update : Msg -> Model -> ( Model, Cmd Msg )
@@ -89,6 +90,12 @@ update msg model =
         DataReceived (Err _) ->
             ( { model | error = Just "Failed to load data" }, Cmd.none )
 
+        ScatterplotMsg Scatterplot.ChangeText1 ->
+            ( { model | csvdata = "Text1" }, Cmd.none )
+
+        ScatterplotMsg Scatterplot.ChangeText2 ->
+            ( { model | csvdata = "Text2" }, Cmd.none )
+
 
 
 -- VIEW
@@ -97,7 +104,7 @@ update msg model =
 view : Model -> Html Msg
 view model =
     div []
-        [ viewScatterplot model
+        [ Scatterplot.viewScatterplot model |> Html.map ScatterplotMsg
         ]
 
 
diff --git a/src/Scatterplot.elm b/src/Scatterplot.elm
index e1f854083f79fab2ecc43c35eeb0be492d790a15..e44d4e16e98a5b279f7d8f285797ac91e29c10bc 100644
--- a/src/Scatterplot.elm
+++ b/src/Scatterplot.elm
@@ -2,6 +2,7 @@ module Scatterplot exposing (..)
 
 import Axis exposing (..)
 import Html exposing (Html)
+import Html.Events exposing (onClick)
 import Scale exposing (ContinuousScale)
 import Statistics
 import TypedSvg exposing (circle, g, style, svg, text_)
@@ -33,7 +34,7 @@ type alias Smartphone =
     , ir_blaster : Maybe Bool
     , processor_name : Maybe String
     , processor_brand : Maybe String
-    , num_cors : Maybe Float
+    , num_cores : Maybe Float
     , processor_speed : Maybe Float
     , battery : Maybe Float
     , fast_charging : Maybe Float
@@ -229,15 +230,20 @@ mapToPoint smartphone =
         smartphone.id
 
 
-viewScatterplot : Model -> Html msg
+viewScatterplot : Model -> Html Msg
 viewScatterplot model =
     let
         filteredSmartphoneData =
             filterSmartphones model.data
-
-        -- numberFilterSmartphones =
-        --     List.length filteredSmartphoneData.data
     in
     Html.div []
-        [ scatterplot filteredSmartphoneData
+        [ Html.button [ onClick ChangeText1 ] [ Html.text "Text1" ]
+        , Html.button [ onClick ChangeText2 ] [ Html.text "Text2" ]
+        , scatterplot filteredSmartphoneData
+        , Html.text model.csvdata
         ]
+
+
+type Msg
+    = ChangeText1
+    | ChangeText2