diff --git a/ping/models.py b/ping/models.py
index 39863365bec1e58b316e14f0202539f8bc65399e..174903d63aec14240180c2fceac88ae792f14f54 100644
--- a/ping/models.py
+++ b/ping/models.py
@@ -61,6 +61,10 @@ class CurrentExperiment(models.Model):
     seed = models.CharField(default="0", max_length=64)
     scheduling = models.CharField(default="sync", max_length=10)
 
+    canvas = models.BooleanField(default=False)
+    canvas_height = models.PositiveIntegerField(default=1)
+    canvas_width = models.PositiveIntegerField(default=1)
+
     com_graph = models.BooleanField(default=False)
     com_fun = models.CharField(default="linear", max_length=64)
     com_refresh = models.PositiveIntegerField(default=1)
@@ -85,3 +89,13 @@ class Link(models.Model):
 class Node(models.Model):
     name = models.CharField(max_length=60)
     group = models.PositiveIntegerField(default=0)
+
+class Canvas(models.Model):
+    agent_id = models.PositiveIntegerField(default=0)
+
+    x = models.PositiveIntegerField(default=0)
+    y = models.PositiveIntegerField(default=0)
+
+    color = models.CharField(max_length=60)
+
+    cycle = models.PositiveIntegerField(default=0)
\ No newline at end of file
diff --git a/ping/templates/ping/play.html b/ping/templates/ping/play.html
index 83f08bff42607614846fe96aa4cac99fb5c8bbfc..f9f3e071d9175480dac2e32142d457da61bd32a0 100644
--- a/ping/templates/ping/play.html
+++ b/ping/templates/ping/play.html
@@ -109,11 +109,13 @@ text {
       const metrics = JSON.parse(e.data).message;
       erraseCanvas();
 
+      console.log(metrics)
+
       var count = metrics.length;
       for (let id_agent = 0; id_agent < count; id_agent++) {
-        context.fillStyle = metrics[id_agent][2];
+        context.fillStyle = metrics[id_agent].color;
         context.beginPath();
-        context.arc(metrics[id_agent][0], metrics[id_agent][1], 1, 0, Math.PI * 2, true);
+        context.arc(metrics[id_agent].x, metrics[id_agent].y, 1, 0, Math.PI * 2, true);
         context.closePath();
         context.fill();
       };
@@ -169,16 +171,12 @@ const myChart = new Chart(document.getElementById("line-chart"), {
   {% endif %}
 
 
+  {% if com_graph %}
 <svg width="500" height="500" style="border:1px solid #000000;"></svg>
 <script>
 
 var graph = {
-  "nodes": [
-            {"id": "Agent_0", "group": 1},
-            {"id": "Agent_1", "group": 2},
-            {"id": "Agent_2", "group": 1},
-            {"id": "Agent_3", "group": 3}
-        ],
+  "nodes": [],
   "links": []
 };
 
@@ -244,6 +242,7 @@ comSocket.onmessage = function (e) {
   simulation.alpha(1).restart();
   };
 </script>
+  {% endif %}
 
 
 </body>
diff --git a/ping/views/play.py b/ping/views/play.py
index 4b9270f643a802e492cea85067b9c01fb6ea333d..cddfaaa15f0cffaa35e73b9effbb244a6800e11f 100644
--- a/ping/views/play.py
+++ b/ping/views/play.py
@@ -17,7 +17,7 @@ from iotAmak.tool.ssh_client import Cmd
 from paho.mqtt.client import Client as MQTTClient
 
 from .tool import delete_folder, get_ssh_client, canvas_event_triger, graph_event_triger, com_event_triger
-from ..models import Experiment, CurrentExperiment, Metrics, Network, Link, Node
+from ..models import Experiment, CurrentExperiment, Metrics, Network, Link, Node, Canvas
 
 client = MQTTClient(client_id="django-ihm")
 
@@ -54,20 +54,27 @@ def agent_metric(client, userdata, message) -> None:
     metrics = Metrics(cycle=exp.cycle, metrics=results)
     metrics.save()
 
-    # if canvas
-    cycle_metrics = [
-        [metric.get("x"), metric.get("y"), metric.get("color")]
-        for metric in results if metric != {}]
-    canvas_event_triger(cycle_metrics)
+    if False:
+        data = 0
+        for metric in results:
+            if metric == {}:
+                pass
+            elif metric.get("color") != "#000000":
+                data += 1
+        graph_event_triger([data, exp.cycle])
 
-    # if graph
-    data = 0
-    for metric in results:
-        if metric == {}:
-            pass
-        elif metric.get("color") != "#000000":
-            data += 1
-    graph_event_triger([data, exp.cycle])
+
+def agent_canvas(client, userdata, message) -> None:
+    results = literal_eval(message.payload.decode("utf-8"))
+
+    canvas = Canvas(
+        agent_id=results.get("id"),
+        x=results.get("x"),
+        y=results.get("y"),
+        color=results.get("color"),
+        cycle=results.get("cycle")
+    )
+    canvas.save()
 
 
 def evaporation():
@@ -82,8 +89,6 @@ def evaporation():
 
 def cycle_done(client, userdata, message) -> None:
     cur_exp = CurrentExperiment.objects.all()[0]
-    cur_exp.cycle += 1
-    cur_exp.save()
 
     if cur_exp.com_graph:
         if cur_exp.cycle % cur_exp.com_refresh == 0:
@@ -106,6 +111,17 @@ def cycle_done(client, userdata, message) -> None:
             }
             com_event_triger(data)
 
+    if cur_exp.canvas:
+        canvas = [
+            {"color": elem.color, "x": elem.x, "y": elem.y}
+            for elem in Canvas.objects.filter(cycle=cur_exp.cycle)
+        ]
+
+        canvas_event_triger(canvas)
+
+    cur_exp.cycle += 1
+    cur_exp.save()
+
 
 def update_nbr_agent(client, userdata, message) -> None:
     results = literal_eval(message.payload.decode("utf-8"))
@@ -114,11 +130,15 @@ def update_nbr_agent(client, userdata, message) -> None:
     subscribe(client, "agent/" + str(results.get("id")) + "/log", agent_log)
     if exp.com_graph:
         subscribe(client, "agent/" + str(results.get("id")) + "/mail", agent_message)
-        node = Node(name="Agent_"+str(results.get("id")), group=results.get("ip"))
+        node = Node(name="Agent_" + str(results.get("id")), group=results.get("ip"))
         node.save()
         for i in range(exp.nbr_agent):
             link = Link(id1=i, id2=results.get("id"))
             link.save()
+
+    if exp.canvas:
+        subscribe(client, "agent/" + str(results.get("id")) + "/canvas", agent_canvas)
+
     exp.nbr_agent += 1
     exp.save()
 
@@ -154,6 +174,12 @@ def experiment_load(request):
         Link.objects.all().delete()
         Node.objects.all().delete()
 
+    if "canvas" in config:
+        cur_exp.canvas = True
+        cur_exp.canvas_height = config.get("canvas").get("height")
+        cur_exp.canvas_width = config.get("canvas").get("width")
+        Canvas.objects.all().delete()
+
     cur_exp.scheduling = config.get("scheduling_type")
 
     cur_exp.save()
@@ -249,23 +275,18 @@ def experiment_start(request):
 def main_play(request):
     context = {}
     canvas = []
+    metrics = []
+    com_graph = False
 
     if len(CurrentExperiment.objects.all()) > 0:
-        cycle = CurrentExperiment.objects.all()[0].cycle
         exp = CurrentExperiment.objects.all()[0]
-        with open(
-                str(settings.MEDIA_ROOT) + "current_experiment/" + exp.name + "/config.json",
-                mode='r',
-                encoding='utf-8'
-        ) as f:
-            data = json.load(f)
-
-            if "canvas" in data:
-                canvas = [data.get("canvas").get("height"), data.get("canvas").get("width")]
+        cycle = exp.cycle
+        if exp.canvas:
+            canvas = [exp.canvas_height, exp.canvas_width]
+        com_graph = exp.com_graph
 
     else:
         cycle = 0
-    metrics = []
     for i in range(cycle):
         # get all the agent 0 metrics
         raw_context = Metrics.objects.filter(cycle=i)[0].metrics
@@ -276,6 +297,7 @@ def main_play(request):
 
     context["metrics"] = metrics
     context["canvas"] = canvas
+    context["com_graph"] = com_graph
 
     template = loader.get_template('ping/play.html')
     return HttpResponse(template.render(context, request))