diff --git a/app/components/Viewer/EdgedCurve/EdgesOptions.vue b/app/components/Viewer/EdgedCurve/EdgesOptions.vue
index 6c98546a..faa4f24f 100644
--- a/app/components/Viewer/EdgedCurve/EdgesOptions.vue
+++ b/app/components/Viewer/EdgedCurve/EdgesOptions.vue
@@ -1,15 +1,17 @@
 <template>
-  <ViewerGenericMeshEdgesOptions
+  <ViewerSpecificEdgesOptions
     :itemProps="props.itemProps"
     :btn_image="EdgedCurveEdges"
+    :index="props.index"
   />
 </template>
 
 <script setup>
-  import ViewerGenericMeshEdgesOptions from "@ogw_front/components/Viewer/Generic/Mesh/EdgesOptions"
+  import ViewerSpecificEdgesOptions from "@ogw_front/components/Viewer/EdgedCurve/SpecificEdgesOptions"
   import EdgedCurveEdges from "@ogw_front/assets/viewer_svgs/edged_curve_edges.svg"
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/components/Viewer/EdgedCurve/SpecificEdgesOptions.vue b/app/components/Viewer/EdgedCurve/SpecificEdgesOptions.vue
new file mode 100644
index 00000000..eca0430e
--- /dev/null
+++ b/app/components/Viewer/EdgedCurve/SpecificEdgesOptions.vue
@@ -0,0 +1,105 @@
+<template>
+  <ViewerContextMenuItem
+    :itemProps="props.itemProps"
+    tooltip="Edges options"
+    :btn_image="props.btn_image"
+    :index="props.index"
+  >
+    <template #options>
+      <ViewerOptionsVisibilitySwitch v-model="visibility" />
+      <template v-if="visibility">
+        <v-row class="pa-0" align="center">
+          <v-divider />
+          <v-col cols="auto" justify="center">
+            <v-icon size="30" icon="mdi-ruler" v-tooltip:left="'Width'" />
+          </v-col>
+          <v-col justify="center">
+            <v-slider
+              v-model="size"
+              hide-details
+              min="0"
+              max="20"
+              step="2"
+              thumb-color="black"
+              ticks
+            />
+          </v-col>
+        </v-row>
+        <v-row>
+          <v-col>
+            <ViewerOptionsColoringTypeSelector
+              :id="id"
+              v-model:coloring_style_key="coloring_style_key"
+              v-model:color="color"
+              v-model:vertex_attribute="vertex_attribute"
+              v-model:edge_attribute="edge_attribute"
+            />
+          </v-col>
+        </v-row>
+      </template>
+    </template>
+  </ViewerContextMenuItem>
+</template>
+
+<script setup>
+  import ViewerContextMenuItem from "@ogw_front/components/Viewer/ContextMenuItem"
+  import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch"
+  import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector"
+
+  import { useDataStyleStore } from "@ogw_front/stores/data_style"
+  import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer"
+
+  const dataStyleStore = useDataStyleStore()
+  const hybridViewerStore = useHybridViewerStore()
+
+  const props = defineProps({
+    itemProps: { type: Object, required: true },
+    btn_image: { type: String, required: true },
+    index: { type: Number, required: true },
+  })
+
+  const id = toRef(() => props.itemProps.id)
+
+  const visibility = computed({
+    get: () => dataStyleStore.meshEdgesVisibility(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshEdgesVisibility(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const size = computed({
+    get: () => dataStyleStore.meshEdgesWidth(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshEdgesWidth(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const coloring_style_key = computed({
+    get: () => dataStyleStore.meshEdgesActiveColoring(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshEdgesActiveColoring(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const color = computed({
+    get: () => dataStyleStore.meshEdgesColor(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshEdgesColor(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const vertex_attribute = computed({
+    get: () => dataStyleStore.meshEdgesVertexAttribute(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshEdgesVertexAttribute(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const edge_attribute = computed({
+    get: () => dataStyleStore.meshEdgesEdgeAttribute(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshEdgesEdgeAttribute(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+</script>
diff --git a/app/components/Viewer/Generic/Mesh/CellsOptions.vue b/app/components/Viewer/Generic/Mesh/CellsOptions.vue
index 7eb4ef3a..2343ebe2 100644
--- a/app/components/Viewer/Generic/Mesh/CellsOptions.vue
+++ b/app/components/Viewer/Generic/Mesh/CellsOptions.vue
@@ -3,6 +3,7 @@
     :itemProps="props.itemProps"
     :tooltip="props.tooltip"
     :btn_image="props.btn_image"
+    :index="props.index"
   >
     <template #options>
       <ViewerOptionsVisibilitySwitch v-model="visibility" />
@@ -34,6 +35,7 @@
   const props = defineProps({
     itemProps: { type: Object, required: true },
     btn_image: { type: String, required: true },
+    index: { type: Number, required: true },
     tooltip: { type: String, required: false, default: "Cells options" },
   })
 
diff --git a/app/components/Viewer/Generic/Mesh/EdgesOptions.vue b/app/components/Viewer/Generic/Mesh/EdgesOptions.vue
index a5e4b493..c11b7d78 100644
--- a/app/components/Viewer/Generic/Mesh/EdgesOptions.vue
+++ b/app/components/Viewer/Generic/Mesh/EdgesOptions.vue
@@ -3,15 +3,37 @@
     :itemProps="props.itemProps"
     tooltip="Edges options"
     :btn_image="props.btn_image"
+    :index="props.index"
   >
     <template #options>
       <ViewerOptionsVisibilitySwitch v-model="visibility" />
       <template v-if="visibility">
-        <ViewerOptionsColoringTypeSelector
-          :id="id"
-          v-model:coloring_style_key="coloring_style_key"
-          v-model:color="color"
-        />
+        <v-row class="pa-0" align="center">
+          <v-divider />
+          <v-col cols="auto" justify="center">
+            <v-icon size="30" icon="mdi-ruler" v-tooltip:left="'Width'" />
+          </v-col>
+          <v-col justify="center">
+            <v-slider
+              v-model="size"
+              hide-details
+              min="0"
+              max="20"
+              step="2"
+              thumb-color="black"
+              ticks
+            />
+          </v-col>
+        </v-row>
+        <v-row>
+          <v-col>
+            <ViewerOptionsColoringTypeSelector
+              :id="id"
+              v-model:coloring_style_key="coloring_style_key"
+              v-model:color="color"
+            />
+          </v-col>
+        </v-row>
       </template>
     </template>
   </ViewerContextMenuItem>
@@ -31,6 +53,7 @@
   const props = defineProps({
     itemProps: { type: Object, required: true },
     btn_image: { type: String, required: true },
+    index: { type: Number, required: true },
   })
 
   const id = toRef(() => props.itemProps.id)
@@ -43,9 +66,9 @@
     },
   })
   const size = computed({
-    get: () => dataStyleStore.edgesSize(id.value),
+    get: () => dataStyleStore.meshEdgesWidth(id.value),
     set: (newValue) => {
-      dataStyleStore.setEdgesSize(id.value, newValue)
+      dataStyleStore.setMeshEdgesWidth(id.value, newValue)
       hybridViewerStore.remoteRender()
     },
   })
@@ -63,4 +86,11 @@
       hybridViewerStore.remoteRender()
     },
   })
+  const vertex_attribute = computed({
+    get: () => dataStyleStore.meshEdgesVertexAttribute(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshEdgesVertexAttribute(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
 </script>
diff --git a/app/components/Viewer/Generic/Mesh/PointsOptions.vue b/app/components/Viewer/Generic/Mesh/PointsOptions.vue
index de8fe81a..3a8f37aa 100644
--- a/app/components/Viewer/Generic/Mesh/PointsOptions.vue
+++ b/app/components/Viewer/Generic/Mesh/PointsOptions.vue
@@ -3,6 +3,7 @@
     :itemProps="props.itemProps"
     tooltip="Points options"
     :btn_image="props.btn_image"
+    :index="props.index"
   >
     <template #options>
       <ViewerOptionsVisibilitySwitch v-model="visibility" />
@@ -30,6 +31,7 @@
               :id="id"
               v-model:coloring_style_key="coloring_style_key"
               v-model:color="color"
+              v-model:vertex_attribute="vertex_attribute"
             />
           </v-col>
         </v-row>
@@ -52,6 +54,7 @@
   const props = defineProps({
     itemProps: { type: Object, required: true },
     btn_image: { type: String, required: true },
+    index: { type: Number, required: true },
   })
 
   const id = toRef(() => props.itemProps.id)
@@ -84,11 +87,4 @@
       hybridViewerStore.remoteRender()
     },
   })
-  const vertex_attribute = computed({
-    get: () => dataStyleStore.meshPointsVertexAttribute(id.value),
-    set: (newValue) => {
-      dataStyleStore.setMeshPointsVertexAttribute(id.value, newValue)
-      hybridViewerStore.remoteRender()
-    },
-  })
 </script>
diff --git a/app/components/Viewer/Generic/Mesh/PolygonsOptions.vue b/app/components/Viewer/Generic/Mesh/PolygonsOptions.vue
index 77af5499..5754c091 100644
--- a/app/components/Viewer/Generic/Mesh/PolygonsOptions.vue
+++ b/app/components/Viewer/Generic/Mesh/PolygonsOptions.vue
@@ -3,6 +3,7 @@
     :itemProps="props.itemProps"
     :tooltip="props.tooltip"
     :btn_image="props.btn_image"
+    :index="props.index"
   >
     <template #options>
       <ViewerOptionsVisibilitySwitch v-model="visibility" />
@@ -12,8 +13,6 @@
           v-model:coloring_style_key="coloring_style_key"
           v-model:color="color"
           v-model:textures="textures"
-          v-model:vertex_attribute="vertex_attribute"
-          v-model:polygon_attribute="polygon_attribute"
         />
       </template>
     </template>
@@ -34,6 +33,7 @@
   const props = defineProps({
     itemProps: { type: Object, required: true },
     btn_image: { type: String, required: true },
+    index: { type: Number, required: true },
     tooltip: { type: String, required: false, default: "Polygons options" },
   })
 
@@ -67,18 +67,4 @@
       hybridViewerStore.remoteRender()
     },
   })
-  const vertex_attribute = computed({
-    get: () => dataStyleStore.meshPolygonsVertexAttribute(id.value),
-    set: (newValue) => {
-      dataStyleStore.setMeshPolygonsVertexAttribute(id.value, newValue)
-      hybridViewerStore.remoteRender()
-    },
-  })
-  const polygon_attribute = computed({
-    get: () => dataStyleStore.meshPolygonsPolygonAttribute(id.value),
-    set: (newValue) => {
-      dataStyleStore.setMeshPolygonsPolygonAttribute(id.value, newValue)
-      hybridViewerStore.remoteRender()
-    },
-  })
 </script>
diff --git a/app/components/Viewer/Generic/Mesh/PolyhedraOptions.vue b/app/components/Viewer/Generic/Mesh/PolyhedraOptions.vue
index 13e0816a..8cc86f6d 100644
--- a/app/components/Viewer/Generic/Mesh/PolyhedraOptions.vue
+++ b/app/components/Viewer/Generic/Mesh/PolyhedraOptions.vue
@@ -3,17 +3,15 @@
     :itemProps="props.itemProps"
     :tooltip="props.tooltip"
     :btn_image="props.btn_image"
+    :index="props.index"
   >
     <template #options>
       <ViewerOptionsVisibilitySwitch v-model="visibility" />
-
       <template v-if="visibility">
         <ViewerOptionsColoringTypeSelector
           :id="id"
           v-model:coloring_style_key="coloring_style_key"
           v-model:color="color"
-          v-model:vertex_attribute="vertex_attribute"
-          v-model:polyhedron_attribute="polyhedron_attribute"
         />
       </template>
     </template>
@@ -35,6 +33,7 @@
     itemProps: { type: Object, required: true },
     btn_image: { type: String, required: true },
     tooltip: { type: String, required: false, default: "Polyhedra options" },
+    index: { type: Number, required: true },
   })
 
   const id = toRef(() => props.itemProps.id)
@@ -60,18 +59,4 @@
       hybridViewerStore.remoteRender()
     },
   })
-  const vertex_attribute = computed({
-    get: () => dataStyleStore.polyhedraVertexAttribute(id.value),
-    set: (newValue) => {
-      dataStyleStore.setPolyhedraVertexAttribute(id.value, newValue)
-      hybridViewerStore.remoteRender()
-    },
-  })
-  const polyhedron_attribute = computed({
-    get: () => dataStyleStore.polyhedraPolyhedronAttribute(id.value),
-    set: (newValue) => {
-      dataStyleStore.setPolyhedraPolyhedronAttribute(id.value, newValue)
-      hybridViewerStore.remoteRender()
-    },
-  })
 </script>
diff --git a/app/components/Viewer/Generic/Model/EdgesOptions.vue b/app/components/Viewer/Generic/Model/EdgesOptions.vue
index 042d086a..955a64d4 100644
--- a/app/components/Viewer/Generic/Model/EdgesOptions.vue
+++ b/app/components/Viewer/Generic/Model/EdgesOptions.vue
@@ -3,6 +3,7 @@
     :itemProps="itemProps"
     tooltip="Edges options"
     :btn_image="SurfaceEdges"
+    :index="props.index"
   >
     <template #options>
       <ViewerOptionsVisibilitySwitch v-model="visibility" />
diff --git a/app/components/Viewer/Generic/Model/PointsOptions.vue b/app/components/Viewer/Generic/Model/PointsOptions.vue
index 0f19e4f3..d54138fb 100644
--- a/app/components/Viewer/Generic/Model/PointsOptions.vue
+++ b/app/components/Viewer/Generic/Model/PointsOptions.vue
@@ -3,6 +3,7 @@
     :itemProps="props.itemProps"
     tooltip="Points options"
     :btn_image="SurfacePoints"
+    :index="props.index"
   >
     <template #options>
       <ViewerOptionsVisibilitySwitch v-model="visibility" />
diff --git a/app/components/Viewer/Options/ColoringTypeSelector.vue b/app/components/Viewer/Options/ColoringTypeSelector.vue
index 50d3eb80..cc6acfce 100644
--- a/app/components/Viewer/Options/ColoringTypeSelector.vue
+++ b/app/components/Viewer/Options/ColoringTypeSelector.vue
@@ -34,9 +34,12 @@
               :id="id"
             />
           </template>
-          <!-- <template v-if="coloring_style_key === edge_dict['value']">
-            <ViewerOptionsEdgeAttributeSelector v-model="edge_attribute" :id="id" />
-          </template> -->
+          <template v-if="coloring_style_key === edge_dict['value']">
+            <ViewerOptionsEdgeAttributeSelector
+              v-model="edge_attribute"
+              :id="id"
+            />
+          </template>
           <template v-if="coloring_style_key === cell_dict['value']">
             <ViewerOptionsCellAttributeSelector
               v-model="cell_attribute"
@@ -65,7 +68,7 @@
   import ViewerOptionsColorPicker from "@ogw_front/components/Viewer/Options/ColorPicker"
   import ViewerOptionsTexturesSelector from "@ogw_front/components/Viewer/Options/TexturesSelector"
   import ViewerOptionsVertexAttributeSelector from "@ogw_front/components/Viewer/Options/VertexAttributeSelector"
-  // import ViewerOptionsEdgeAttributeSelector from "@ogw_front/components/Viewer/Options/EdgeAttributeSelector"
+  import ViewerOptionsEdgeAttributeSelector from "@ogw_front/components/Viewer/Options/EdgeAttributeSelector"
   import ViewerOptionsPolygonAttributeSelector from "@ogw_front/components/Viewer/Options/PolygonAttributeSelector"
   import ViewerOptionsCellAttributeSelector from "@ogw_front/components/Viewer/Options/CellAttributeSelector"
   import ViewerOptionsPolyhedronAttributeSelector from "@ogw_front/components/Viewer/Options/PolyhedronAttributeSelector"
@@ -75,7 +78,7 @@
   const color = defineModel("color")
   const textures = defineModel("textures")
   const vertex_attribute = defineModel("vertex_attribute")
-  // const edge_attribute = defineModel("edge_attribute");
+  const edge_attribute = defineModel("edge_attribute")
   const cell_attribute = defineModel("cell_attribute")
   const polygon_attribute = defineModel("polygon_attribute")
   const polyhedron_attribute = defineModel("polyhedron_attribute")
@@ -91,7 +94,9 @@
   const has_vertex = computed(() =>
     vertex_attribute.value !== undefined ? true : false,
   )
-  // const has_edge = computed(() => (edge_attribute.value !== undefined ? true : false));
+  const has_edge = computed(() =>
+    edge_attribute.value !== undefined ? true : false,
+  )
   const has_cells = computed(() =>
     cell_attribute.value !== undefined ? true : false,
   )
@@ -105,7 +110,7 @@
   const color_dict = { name: "Color", value: "color" }
   const textures_dict = { name: "Textures", value: "textures" }
   const vertex_dict = { name: "Vertex attribute", value: "vertex" }
-  // const edge_dict = { name: "Edge attribute", value: "edge" }
+  const edge_dict = { name: "Edge attribute", value: "edge" }
   const cell_dict = { name: "Cell attribute", value: "cell" }
   const polygon_dict = { name: "Polygon attribute", value: "polygon" }
   const polyhedron_dict = {
@@ -117,7 +122,7 @@
     if (has_color.value) array.push(color_dict)
     if (has_textures.value) array.push(textures_dict)
     if (has_vertex.value) array.push(vertex_dict)
-    // if (has_edges.value) array.push(edge_dict);
+    if (has_edge.value) array.push(edge_dict)
     if (has_cells.value) array.push(cell_dict)
     if (has_polygons.value) array.push(polygon_dict)
     if (has_polyhedra.value) array.push(polyhedron_dict)
diff --git a/app/components/Viewer/Options/EdgeAttributeSelector.vue b/app/components/Viewer/Options/EdgeAttributeSelector.vue
new file mode 100644
index 00000000..5007a65c
--- /dev/null
+++ b/app/components/Viewer/Options/EdgeAttributeSelector.vue
@@ -0,0 +1,72 @@
+<template>
+  <v-row justify="center" align="center">
+    <v-col cols="auto">
+      <v-icon
+        size="30"
+        icon="mdi-ray-end-arrow"
+        v-tooltip:left="'Edge Attribute'"
+      />
+    </v-col>
+    <v-col>
+      <v-select
+        v-model="edge_attribute_name"
+        :items="edge_attribute_names"
+        label="Select an edge attribute"
+        density="compact"
+        hide-details
+      />
+    </v-col>
+  </v-row>
+</template>
+
+<script setup>
+  import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json"
+  import { useGeodeStore } from "@ogw_front/stores/geode"
+
+  const geodeStore = useGeodeStore()
+
+  const model = defineModel()
+
+  const props = defineProps({
+    id: { type: String, required: true },
+  })
+
+  const edge_attribute_name = ref("")
+  const edge_attribute_names = ref([])
+
+  onMounted(() => {
+    if (model.value != null) {
+      edge_attribute_name.value = model.value.name
+    }
+  })
+
+  const edge_attribute = reactive({ name: edge_attribute_name.value })
+
+  watch(edge_attribute_name, (value) => {
+    edge_attribute.name = value
+    model.value = edge_attribute
+  })
+
+  function get_edge_attribute_names() {
+    geodeStore.request(
+      back_schemas.opengeodeweb_back.edge_attribute_names,
+      { id: props.id },
+      {
+        response_function: (response) => {
+          edge_attribute_names.value = response.edge_attribute_names
+        },
+      },
+    )
+  }
+
+  onMounted(() => {
+    get_edge_attribute_names()
+  })
+
+  watch(
+    () => props.id,
+    () => {
+      get_edge_attribute_names()
+    },
+  )
+</script>
diff --git a/app/components/Viewer/Options/VertexAttributeSelector.vue b/app/components/Viewer/Options/VertexAttributeSelector.vue
index 3dcc5036..fbdef889 100644
--- a/app/components/Viewer/Options/VertexAttributeSelector.vue
+++ b/app/components/Viewer/Options/VertexAttributeSelector.vue
@@ -9,6 +9,9 @@
 
 <script setup>
   import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json"
+  import { useGeodeStore } from "@ogw_front/stores/geode"
+
+  const geodeStore = useGeodeStore()
 
   const model = defineModel()
 
diff --git a/app/components/Viewer/PointSet/PointsOptions.vue b/app/components/Viewer/PointSet/PointsOptions.vue
index 37318d96..99dd8733 100644
--- a/app/components/Viewer/PointSet/PointsOptions.vue
+++ b/app/components/Viewer/PointSet/PointsOptions.vue
@@ -2,6 +2,7 @@
   <ViewerPointSetSpecificPointsOptions
     :itemProps="props.itemProps"
     :btn_image="PointSetPoints"
+    :index="props.index"
   />
 </template>
 
@@ -11,5 +12,6 @@
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/components/Viewer/PointSet/SpecificPointsOptions.vue b/app/components/Viewer/PointSet/SpecificPointsOptions.vue
index 39338789..15562a8d 100644
--- a/app/components/Viewer/PointSet/SpecificPointsOptions.vue
+++ b/app/components/Viewer/PointSet/SpecificPointsOptions.vue
@@ -3,6 +3,7 @@
     :itemProps="props.itemProps"
     tooltip="Points options"
     :btn_image="props.btn_image"
+    :index="props.index"
   >
     <template #options>
       <ViewerOptionsVisibilitySwitch v-model="visibility" />
@@ -53,6 +54,7 @@
   const props = defineProps({
     itemProps: { type: Object, required: true },
     btn_image: { type: String, required: true },
+    index: { type: Number, required: true },
   })
 
   const id = toRef(() => props.itemProps.id)
diff --git a/app/components/Viewer/PolygonalSurface/PointsOptions.vue b/app/components/Viewer/PolygonalSurface/PointsOptions.vue
index e50d6023..f0fe6dfa 100644
--- a/app/components/Viewer/PolygonalSurface/PointsOptions.vue
+++ b/app/components/Viewer/PolygonalSurface/PointsOptions.vue
@@ -2,6 +2,7 @@
   <ViewerGenericMeshPointsOptions
     :itemProps="props.itemProps"
     :btn_image="PolygonalSurfacePoints"
+    :index="props.index"
   />
 </template>
 
@@ -11,5 +12,6 @@
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/components/Viewer/PolygonalSurface/PolygonsOptions.vue b/app/components/Viewer/PolygonalSurface/PolygonsOptions.vue
index 92a904a5..eda1799e 100644
--- a/app/components/Viewer/PolygonalSurface/PolygonsOptions.vue
+++ b/app/components/Viewer/PolygonalSurface/PolygonsOptions.vue
@@ -1,15 +1,17 @@
 <template>
-  <ViewerGenericMeshPolygonsOptions
+  <ViewerSpecificPolygonsOptions
     :itemProps="props.itemProps"
     :btn_image="PolygonalSurfacePolygons"
+    :index="props.index"
   />
 </template>
 
 <script setup>
-  import ViewerGenericMeshPolygonsOptions from "@ogw_front/components/Viewer/Generic/Mesh/PolygonsOptions"
+  import ViewerSpecificPolygonsOptions from "@ogw_front/components/Viewer/PolygonalSurface/SpecificPolygonsOptions"
   import PolygonalSurfacePolygons from "@ogw_front/assets/viewer_svgs/surface_triangles.svg"
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/components/Viewer/PolygonalSurface/SpecificPolygonsOptions.vue b/app/components/Viewer/PolygonalSurface/SpecificPolygonsOptions.vue
new file mode 100644
index 00000000..aa434a7f
--- /dev/null
+++ b/app/components/Viewer/PolygonalSurface/SpecificPolygonsOptions.vue
@@ -0,0 +1,86 @@
+<template>
+  <ViewerContextMenuItem
+    :itemProps="props.itemProps"
+    :tooltip="props.tooltip"
+    :btn_image="props.btn_image"
+    :index="props.index"
+  >
+    <template #options>
+      <ViewerOptionsVisibilitySwitch v-model="visibility" />
+      <template v-if="visibility">
+        <ViewerOptionsColoringTypeSelector
+          :id="id"
+          v-model:coloring_style_key="coloring_style_key"
+          v-model:color="color"
+          v-model:textures="textures"
+          v-model:vertex_attribute="vertex_attribute"
+          v-model:polygon_attribute="polygon_attribute"
+        />
+      </template>
+    </template>
+  </ViewerContextMenuItem>
+</template>
+
+<script setup>
+  import ViewerContextMenuItem from "@ogw_front/components/Viewer/ContextMenuItem"
+  import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch"
+  import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector"
+
+  import { useDataStyleStore } from "@ogw_front/stores/data_style"
+  import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer"
+
+  const dataStyleStore = useDataStyleStore()
+  const hybridViewerStore = useHybridViewerStore()
+
+  const props = defineProps({
+    itemProps: { type: Object, required: true },
+    btn_image: { type: String, required: true },
+    index: { type: Number, required: true },
+    tooltip: { type: String, required: false, default: "Polygons options" },
+  })
+
+  const id = toRef(() => props.itemProps.id)
+
+  const visibility = computed({
+    get: () => dataStyleStore.meshPolygonsVisibility(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshPolygonsVisibility(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const coloring_style_key = computed({
+    get: () => dataStyleStore.meshPolygonsActiveColoring(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshPolygonsActiveColoring(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const color = computed({
+    get: () => dataStyleStore.meshPolygonsColor(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshPolygonsColor(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const textures = computed({
+    get: () => dataStyleStore.meshPolygonsTextures(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshPolygonsTextures(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const vertex_attribute = computed({
+    get: () => dataStyleStore.meshPolygonsVertexAttribute(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshPolygonsVertexAttribute(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const polygon_attribute = computed({
+    get: () => dataStyleStore.meshPolygonsPolygonAttribute(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshPolygonsPolygonAttribute(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+</script>
diff --git a/app/components/Viewer/Solid/EdgesOptions.vue b/app/components/Viewer/Solid/EdgesOptions.vue
index 7fc2c66b..d159ce27 100644
--- a/app/components/Viewer/Solid/EdgesOptions.vue
+++ b/app/components/Viewer/Solid/EdgesOptions.vue
@@ -2,6 +2,7 @@
   <ViewerGenericMeshEdgesOptions
     :itemProps="props.itemProps"
     :btn_image="SolidEdges"
+    :index="props.index"
   />
 </template>
 
@@ -11,5 +12,6 @@
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/components/Viewer/Solid/PointsOptions.vue b/app/components/Viewer/Solid/PointsOptions.vue
index e903da1d..90915b0e 100644
--- a/app/components/Viewer/Solid/PointsOptions.vue
+++ b/app/components/Viewer/Solid/PointsOptions.vue
@@ -2,6 +2,7 @@
   <ViewerGenericMeshPointsOptions
     :itemProps="props.itemProps"
     :btn_image="SolidPoints"
+    :index="props.index"
   />
 </template>
 
@@ -11,5 +12,6 @@
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/components/Viewer/Solid/PolygonsOptions.vue b/app/components/Viewer/Solid/PolygonsOptions.vue
index 0f4946a3..77a80120 100644
--- a/app/components/Viewer/Solid/PolygonsOptions.vue
+++ b/app/components/Viewer/Solid/PolygonsOptions.vue
@@ -2,6 +2,7 @@
   <ViewerGenericMeshPolygonsOptions
     :itemProps="props.itemProps"
     :btn_image="SolidFacets"
+    :index="props.index"
   />
 </template>
 
@@ -11,5 +12,6 @@
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/components/Viewer/Solid/PolyhedraOptions.vue b/app/components/Viewer/Solid/PolyhedraOptions.vue
index 3828966a..7ba7b8ff 100644
--- a/app/components/Viewer/Solid/PolyhedraOptions.vue
+++ b/app/components/Viewer/Solid/PolyhedraOptions.vue
@@ -1,15 +1,17 @@
 <template>
-  <ViewerGenericMeshPolyhedraOptions
+  <ViewerSpecificPolyhedraOptions
     :itemProps="props.itemProps"
     :btn_image="SolidPolyhedra"
+    :index="props.index"
   />
 </template>
 
 <script setup>
-  import ViewerGenericMeshPolyhedraOptions from "@ogw_front/components/Viewer/Generic/Mesh/PolyhedraOptions"
+  import ViewerSpecificPolyhedraOptions from "@ogw_front/components/Viewer/Solid/SpecificPolyhedraOptions"
   import SolidPolyhedra from "@ogw_front/assets/viewer_svgs/solid_polyhedra.svg"
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/components/Viewer/Solid/SpecificPolyhedraOptions.vue b/app/components/Viewer/Solid/SpecificPolyhedraOptions.vue
new file mode 100644
index 00000000..ed18cf01
--- /dev/null
+++ b/app/components/Viewer/Solid/SpecificPolyhedraOptions.vue
@@ -0,0 +1,78 @@
+<template>
+  <ViewerContextMenuItem
+    :itemProps="props.itemProps"
+    :tooltip="props.tooltip"
+    :btn_image="props.btn_image"
+    :index="props.index"
+  >
+    <template #options>
+      <ViewerOptionsVisibilitySwitch v-model="visibility" />
+      <template v-if="visibility">
+        <ViewerOptionsColoringTypeSelector
+          :id="id"
+          v-model:coloring_style_key="coloring_style_key"
+          v-model:color="color"
+          v-model:vertex_attribute="vertex_attribute"
+          v-model:polyhedron_attribute="polyhedron_attribute"
+        />
+      </template>
+    </template>
+  </ViewerContextMenuItem>
+</template>
+
+<script setup>
+  import ViewerContextMenuItem from "@ogw_front/components/Viewer/ContextMenuItem"
+  import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch"
+  import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector"
+
+  import { useDataStyleStore } from "@ogw_front/stores/data_style"
+  import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer"
+
+  const dataStyleStore = useDataStyleStore()
+  const hybridViewerStore = useHybridViewerStore()
+
+  const props = defineProps({
+    itemProps: { type: Object, required: true },
+    btn_image: { type: String, required: true },
+    tooltip: { type: String, required: false, default: "Polyhedra options" },
+    index: { type: Number, required: true },
+  })
+
+  const id = toRef(() => props.itemProps.id)
+
+  const visibility = computed({
+    get: () => dataStyleStore.meshPolyhedraVisibility(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshPolyhedraVisibility(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const coloring_style_key = computed({
+    get: () => dataStyleStore.meshPolyhedraActiveColoring(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshPolyhedraActiveColoring(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const color = computed({
+    get: () => dataStyleStore.meshPolyhedraColor(id.value),
+    set: (newValue) => {
+      dataStyleStore.setMeshPolyhedraColor(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const vertex_attribute = computed({
+    get: () => dataStyleStore.polyhedraVertexAttribute(id.value),
+    set: (newValue) => {
+      dataStyleStore.setPolyhedraVertexAttribute(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+  const polyhedron_attribute = computed({
+    get: () => dataStyleStore.polyhedraPolyhedronAttribute(id.value),
+    set: (newValue) => {
+      dataStyleStore.setPolyhedraPolyhedronAttribute(id.value, newValue)
+      hybridViewerStore.remoteRender()
+    },
+  })
+</script>
diff --git a/app/components/Viewer/TetrahedralSolid/TetrahedraOptions.vue b/app/components/Viewer/TetrahedralSolid/TetrahedraOptions.vue
index 1e58b835..4cb41219 100644
--- a/app/components/Viewer/TetrahedralSolid/TetrahedraOptions.vue
+++ b/app/components/Viewer/TetrahedralSolid/TetrahedraOptions.vue
@@ -3,6 +3,7 @@
     :itemProps="props.itemProps"
     :btn_image="TetrahedralSolidTetrahedra"
     tooltip="Tetrahedra options"
+    :index="props.index"
   />
 </template>
 
@@ -12,5 +13,6 @@
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/components/Viewer/TetrahedralSolid/TrianglesOptions.vue b/app/components/Viewer/TetrahedralSolid/TrianglesOptions.vue
index a1cb4fde..559dfac4 100644
--- a/app/components/Viewer/TetrahedralSolid/TrianglesOptions.vue
+++ b/app/components/Viewer/TetrahedralSolid/TrianglesOptions.vue
@@ -3,6 +3,7 @@
     :itemProps="props.itemProps"
     :btn_image="TetrahedralSolidTriangles"
     tooltip="Triangles options"
+    :index="props.index"
   />
 </template>
 
@@ -12,5 +13,6 @@
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/components/Viewer/TriangulatedSurface/EdgesOptions.vue b/app/components/Viewer/TriangulatedSurface/EdgesOptions.vue
index f17e779f..d1e16ff4 100644
--- a/app/components/Viewer/TriangulatedSurface/EdgesOptions.vue
+++ b/app/components/Viewer/TriangulatedSurface/EdgesOptions.vue
@@ -2,6 +2,7 @@
   <ViewerGenericMeshEdgesOptions
     :itemProps="props.itemProps"
     :btn_image="SurfaceEdges"
+    :index="props.index"
   />
 </template>
 
@@ -11,5 +12,6 @@
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/components/Viewer/TriangulatedSurface/PointsOptions.vue b/app/components/Viewer/TriangulatedSurface/PointsOptions.vue
index fb8093e9..459f445f 100644
--- a/app/components/Viewer/TriangulatedSurface/PointsOptions.vue
+++ b/app/components/Viewer/TriangulatedSurface/PointsOptions.vue
@@ -2,6 +2,7 @@
   <ViewerGenericMeshPointsOptions
     :itemProps="props.itemProps"
     :btn_image="TriangulatedSurfaceEdgesPoints"
+    :index="props.index"
   />
 </template>
 
@@ -11,5 +12,6 @@
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/components/Viewer/TriangulatedSurface/TrianglesOptions.vue b/app/components/Viewer/TriangulatedSurface/TrianglesOptions.vue
index ba5e30c3..1e55f246 100644
--- a/app/components/Viewer/TriangulatedSurface/TrianglesOptions.vue
+++ b/app/components/Viewer/TriangulatedSurface/TrianglesOptions.vue
@@ -1,16 +1,18 @@
 <template>
-  <ViewerGenericMeshPolygonsOptions
+  <ViewerSpecificPolygonsOptions
     :itemProps="props.itemProps"
-    :btn_image="TriangulatedSurfaceEdgesTriangles"
+    :btn_image="TriangulatedSurfaceTriangles"
+    :index="props.index"
     tooltip="Triangles options"
   />
 </template>
 
 <script setup>
-  import ViewerGenericMeshPolygonsOptions from "@ogw_front/components/Viewer/Generic/Mesh/PolygonsOptions"
-  import TriangulatedSurfaceEdgesTriangles from "@ogw_front/assets/viewer_svgs/surface_triangles.svg"
+  import ViewerSpecificPolygonsOptions from "@ogw_front/components/Viewer/PolygonalSurface/SpecificPolygonsOptions"
+  import TriangulatedSurfaceTriangles from "@ogw_front/assets/viewer_svgs/surface_triangles.svg"
 
   const props = defineProps({
     itemProps: { type: Object, required: true },
+    index: { type: Number, required: true },
   })
 </script>
diff --git a/app/stores/geode.js b/app/stores/geode.js
index 61623b76..1d1a975c 100644
--- a/app/stores/geode.js
+++ b/app/stores/geode.js
@@ -44,36 +44,33 @@ export const useGeodeStore = defineStore("geode", {
     },
   },
   actions: {
-    ping_task() {
+    set_ping() {
+      this.ping()
       setInterval(() => {
-        this.do_ping()
+        this.ping()
       }, 10 * 1000)
     },
-    do_ping() {
+    ping() {
       const geodeStore = this
       const feedbackStore = useFeedbackStore()
-      return $fetch(back_schemas.opengeodeweb_back.ping.$id, {
-        baseURL: this.base_url,
-        method: back_schemas.opengeodeweb_back.ping.methods[0],
-        body: {},
-        onResponse({ response }) {
-          if (response.ok) {
+      return this.request(
+        back_schemas.opengeodeweb_back.ping,
+        {},
+        {
+          request_error_function: () => {
+            feedbackStore.$patch({ server_error: true })
+            geodeStore.status = Status.NOT_CONNECTED
+          },
+          response_function: () => {
             feedbackStore.$patch({ server_error: false })
             geodeStore.status = Status.CONNECTED
-          }
-        },
-        onResponseError({ response }) {
-          feedbackStore.$patch({ server_error: true })
-          geodeStore.status = Status.NOT_CONNECTED
-        },
-        onRequestError({ error }) {
-          feedbackStore.$patch({ server_error: true })
-          geodeStore.status = Status.NOT_CONNECTED
+          },
+          response_error_function: () => {
+            feedbackStore.$patch({ server_error: true })
+            geodeStore.status = Status.NOT_CONNECTED
+          },
         },
-      })
-    },
-    ping() {
-      return this.do_ping()
+      )
     },
     start_request() {
       this.request_counter++
@@ -87,7 +84,8 @@ export const useGeodeStore = defineStore("geode", {
     },
     connect() {
       console.log("[GEODE] Connecting to geode microservice...")
-      return this.ping_task()
+      this.set_ping()
+      return Promise.resolve()
     },
     request(schema, params, callbacks = {}) {
       console.log("[GEODE] Request:", schema.$id)
diff --git a/app/utils/default_styles.js b/app/utils/default_styles.js
index 517cf33b..58a61bde 100644
--- a/app/utils/default_styles.js
+++ b/app/utils/default_styles.js
@@ -7,7 +7,7 @@ const polygons_defaultVisibility = true
 const polyhedra_defaultVisibility = true
 const points_defaultSize = 10
 const points_defaultColor = { r: 20, g: 20, b: 20 }
-const edges_defaultSize = 5
+const edges_defaultWidth = 2
 const edges_defaultColor = { r: 20, g: 20, b: 20 }
 const cells_defaultColor = { r: 255, g: 255, b: 255 }
 const polygons_defaultColor = { r: 255, g: 255, b: 255 }
@@ -41,7 +41,7 @@ const meshPointsDefaultStyle = (
 
 const meshEdgesDefaultStyle = (
   visibility = edges_defaultVisibility,
-  size = edges_defaultSize,
+  width = edges_defaultWidth,
   color = edges_defaultColor,
 ) => {
   return {
@@ -49,8 +49,10 @@ const meshEdgesDefaultStyle = (
     coloring: {
       active: "color",
       color,
+      edge: null,
+      vertex: null,
     },
-    size,
+    width,
   }
 }
 
@@ -196,7 +198,7 @@ const brep_defaultStyle = () => {
     surfaces: modelSurfacesDefaultStyle(),
     blocks: modelBlocksDefaultStyle(),
     points: modelPointsDefaultStyle(false, points_defaultSize),
-    edges: modelEdgesDefaultStyle(false, edges_defaultSize),
+    edges: modelEdgesDefaultStyle(false, edges_defaultWidth),
   }
 }
 
@@ -207,7 +209,7 @@ const crossSection_defaultStyle = () => {
     lines: modelLinesDefaultStyle(),
     surfaces: modelSurfacesDefaultStyle(),
     points: modelPointsDefaultStyle(false, points_defaultSize),
-    edges: modelEdgesDefaultStyle(false, edges_defaultSize),
+    edges: modelEdgesDefaultStyle(false, edges_defaultWidth),
   }
 }
 
@@ -219,7 +221,7 @@ const structuralModel_defaultStyle = () => {
     surfaces: modelSurfacesDefaultStyle(),
     blocks: modelBlocksDefaultStyle(),
     points: modelPointsDefaultStyle(false, points_defaultSize),
-    edges: modelEdgesDefaultStyle(false, edges_defaultSize),
+    edges: modelEdgesDefaultStyle(false, edges_defaultWidth),
   }
 }
 
@@ -230,7 +232,7 @@ const section_defaultStyle = () => {
     lines: modelLinesDefaultStyle(),
     surfaces: modelSurfacesDefaultStyle(),
     points: modelPointsDefaultStyle(false, points_defaultSize),
-    edges: modelEdgesDefaultStyle(false, edges_defaultSize),
+    edges: modelEdgesDefaultStyle(false, edges_defaultWidth),
   }
 }
 
@@ -241,7 +243,7 @@ const implicitCrossSection_defaultStyle = () => {
     lines: modelLinesDefaultStyle(),
     surfaces: modelSurfacesDefaultStyle(),
     points: modelPointsDefaultStyle(false, points_defaultSize),
-    edges: modelEdgesDefaultStyle(false, edges_defaultSize),
+    edges: modelEdgesDefaultStyle(false, edges_defaultWidth),
   }
 }
 
@@ -253,7 +255,7 @@ const implicitStructuralModel_defaultStyle = () => {
     surfaces: modelSurfacesDefaultStyle(),
     blocks: modelBlocksDefaultStyle(),
     points: modelPointsDefaultStyle(false, points_defaultSize),
-    edges: modelEdgesDefaultStyle(false, edges_defaultSize),
+    edges: modelEdgesDefaultStyle(false, edges_defaultWidth),
   }
 }
 
diff --git a/internal/stores/mesh/edges.js b/internal/stores/mesh/edges.js
index 7755c093..19fa0e84 100644
--- a/internal/stores/mesh/edges.js
+++ b/internal/stores/mesh/edges.js
@@ -49,10 +49,16 @@ export function useMeshEdgesStyle() {
     )
     if (type === "color") {
       return setMeshEdgesColor(id, coloring.color)
-      // } else if (type == "vertex" && coloring.vertex !== null) {
-      //   return setEdgesVertexAttribute(id, coloring.vertex)
-      // } else if (type == "edges" && coloring.edges !== null) {
-      //   return setEdgesEdgeAttribute(id, coloring.edges)
+    } else if (type === "vertex") {
+      if (coloring.vertex === null) {
+        return
+      }
+      return setMeshEdgesVertexAttribute(id, coloring.vertex)
+    } else if (type === "edge") {
+      if (coloring.edge === null) {
+        return
+      }
+      return setMeshEdgesEdgeAttribute(id, coloring.edge)
     } else {
       throw new Error("Unknown mesh edges coloring type: " + type)
     }
@@ -80,7 +86,7 @@ export function useMeshEdgesStyle() {
   }
 
   function meshEdgesWidth(id) {
-    return meshEdgesStyle(id).size
+    return meshEdgesStyle(id).width
   }
   function setMeshEdgesWidth(id, width) {
     const edges_style = meshEdgesStyle(id)
@@ -96,12 +102,54 @@ export function useMeshEdgesStyle() {
     )
   }
 
+  function meshEdgesVertexAttribute(id) {
+    return meshEdgesStyle(id).coloring.vertex
+  }
+  function setMeshEdgesVertexAttribute(id, vertex_attribute) {
+    const coloring_style = meshEdgesStyle(id).coloring
+    return viewerStore.request(
+      mesh_edges_schemas.vertex_attribute,
+      { id, ...vertex_attribute },
+      {
+        response_function: () => {
+          coloring_style.vertex = vertex_attribute
+          console.log(
+            setMeshEdgesVertexAttribute.name,
+            { id },
+            meshEdgesVertexAttribute(id),
+          )
+        },
+      },
+    )
+  }
+
+  function meshEdgesEdgeAttribute(id) {
+    return meshEdgesStyle(id).coloring.edge
+  }
+  function setMeshEdgesEdgeAttribute(id, edge_attribute) {
+    const coloring_style = meshEdgesStyle(id).coloring
+    return viewerStore.request(
+      mesh_edges_schemas.edge_attribute,
+      { id, ...edge_attribute },
+      {
+        response_function: () => {
+          coloring_style.edge = edge_attribute
+          console.log(
+            setMeshEdgesEdgeAttribute.name,
+            { id },
+            meshEdgesEdgeAttribute(id),
+          )
+        },
+      },
+    )
+  }
+
   function applyMeshEdgesStyle(id) {
     const style = meshEdgesStyle(id)
     return Promise.all([
       setMeshEdgesVisibility(id, style.visibility),
       setMeshEdgesActiveColoring(id, style.coloring.active),
-      // setMeshEdgesWidth(id, style.width);
+      setMeshEdgesWidth(id, style.width),
     ])
   }
 
@@ -111,9 +159,13 @@ export function useMeshEdgesStyle() {
     meshEdgesColor,
     meshEdgesVisibility,
     meshEdgesWidth,
+    meshEdgesVertexAttribute,
+    meshEdgesEdgeAttribute,
     setMeshEdgesActiveColoring,
     setMeshEdgesColor,
     setMeshEdgesVisibility,
     setMeshEdgesWidth,
+    setMeshEdgesVertexAttribute,
+    setMeshEdgesEdgeAttribute,
   }
 }
diff --git a/internal/stores/mesh/points.js b/internal/stores/mesh/points.js
index 6627f836..38e63746 100644
--- a/internal/stores/mesh/points.js
+++ b/internal/stores/mesh/points.js
@@ -48,9 +48,12 @@ export function useMeshPointsStyle() {
       { id },
       meshPointsActiveColoring(id),
     )
-    if (type == "color") {
+    if (type === "color") {
       return setMeshPointsColor(id, coloring.color)
-    } else if (type == "vertex" && coloring.vertex !== null) {
+    } else if (type === "vertex") {
+      if (coloring.vertex === null) {
+        return
+      }
       return setMeshPointsVertexAttribute(id, coloring.vertex)
     } else {
       throw new Error("Unknown mesh points coloring type: " + type)
diff --git a/internal/stores/mesh/polyhedra.js b/internal/stores/mesh/polyhedra.js
index e44f8ee4..6e76e8c7 100644
--- a/internal/stores/mesh/polyhedra.js
+++ b/internal/stores/mesh/polyhedra.js
@@ -49,10 +49,16 @@ export function useMeshPolyhedraStyle() {
     )
     if (type === "color") {
       return setMeshPolyhedraColor(id, coloring.color)
-      // } else if (type === "vertex" && coloring.vertex !== null) {
-      //   return setPolyhedraVertexAttribute(id, coloring.vertex)
-      // } else if (type === "polyhedron" && coloring.polyhedron !== null) {
-      //   return setPolyhedraPolyhedronAttribute(id, coloring.polyhedron)
+    } else if (type === "vertex") {
+      if (coloring.vertex === null) {
+        return
+      }
+      return setPolyhedraVertexAttribute(id, coloring.vertex)
+    } else if (type === "polyhedron") {
+      if (coloring.polyhedron === null) {
+        return
+      }
+      return setPolyhedraPolyhedronAttribute(id, coloring.polyhedron)
     } else {
       throw new Error("Unknown mesh polyhedra coloring type: " + type)
     }
@@ -79,62 +85,47 @@ export function useMeshPolyhedraStyle() {
     )
   }
 
-  // function polyhedraVertexAttribute(id) {
-  //   return meshPolyhedraStyle(id).coloring.vertex
-  // }
-  // function setPolyhedraVertexAttribute(id, vertex_attribute) {
-  //   const coloring_style = meshPolyhedraStyle(id).coloring
-  //   return viewerStore.request(
-  //     mesh_polyhedra_schemas.vertex_attribute,
-  //     { id, ...vertex_attribute },
-  //     {
-  //       response_function: () => {
-  //         coloring_style.vertex = vertex_attribute
-  //         console.log(
-  //           setPolyhedraVertexAttribute.name} ${polyhedraVertexAttribute(id),
-  //         )
-  //       },
-  //     },
-  //   )
-  // }
-
-  // function polyhedraPolygonAttribute(id) {
-  //   return meshPolyhedraStyle(id).coloring.polygon
-  // }
-  // function setPolyhedraPolygonAttribute(id, polygon_attribute) {
-  //   const coloring_style = meshPolyhedraStyle(id).coloring
-  //   return viewerStore.request(
-  //     mesh_polyhedra_schemas.polygon_attribute,
-  //     { id, ...polygon_attribute },
-  //     {
-  //       response_function: () => {
-  //         coloring_style.polygon = polygon_attribute
-  //         console.log(
-  //           setPolyhedraPolygonAttribute.name} ${polyhedraPolygonAttribute(id),
-  //         )
-  //       },
-  //     },
-  //   )
-  // }
+  function polyhedraVertexAttribute(id) {
+    return meshPolyhedraStyle(id).coloring.vertex
+  }
+  function setPolyhedraVertexAttribute(id, vertex_attribute) {
+    const coloring_style = meshPolyhedraStyle(id).coloring
+    return viewerStore.request(
+      mesh_polyhedra_schemas.vertex_attribute,
+      { id, ...vertex_attribute },
+      {
+        response_function: () => {
+          coloring_style.vertex = vertex_attribute
+          console.log(
+            setPolyhedraVertexAttribute.name,
+            { id },
+            polyhedraVertexAttribute(id),
+          )
+        },
+      },
+    )
+  }
 
-  // function polyhedraPolyhedronAttribute(id) {
-  //   return meshPolyhedraStyle(id).coloring.polyhedron
-  // }
-  // function setPolyhedraPolyhedronAttribute(id, polyhedron_attribute) {
-  //   const coloring = meshPolyhedraStyle(id).coloring
-  //   return viewerStore.request(
-  //     mesh_polyhedra_schemas.polyhedron_attribute,
-  //     { id, ...polyhedron_attribute },
-  //     {
-  //       response_function: () => {
-  //         coloring.polyhedron = polyhedron_attribute
-  //         console.log(
-  //           setPolyhedraPolyhedronAttribute.name} ${polyhedraPolyhedronAttribute(id),
-  //         )
-  //       },
-  //     },
-  //   )
-  // }
+  function polyhedraPolyhedronAttribute(id) {
+    return meshPolyhedraStyle(id).coloring.polyhedron
+  }
+  function setPolyhedraPolyhedronAttribute(id, polyhedron_attribute) {
+    const coloring = meshPolyhedraStyle(id).coloring
+    return viewerStore.request(
+      mesh_polyhedra_schemas.polyhedron_attribute,
+      { id, ...polyhedron_attribute },
+      {
+        response_function: () => {
+          coloring.polyhedron = polyhedron_attribute
+          console.log(
+            setPolyhedraPolyhedronAttribute.name,
+            { id },
+            polyhedraPolyhedronAttribute(id),
+          )
+        },
+      },
+    )
+  }
 
   function applyMeshPolyhedraStyle(id) {
     const style = meshPolyhedraStyle(id)
@@ -148,15 +139,13 @@ export function useMeshPolyhedraStyle() {
     applyMeshPolyhedraStyle,
     meshPolyhedraActiveColoring,
     meshPolyhedraColor,
-    // polyhedraVertexAttribute,
+    polyhedraVertexAttribute,
     meshPolyhedraVisibility,
-    // polyhedraPolyhedronAttribute,
-    // polyhedraPolygonAttribute,
+    polyhedraPolyhedronAttribute,
     setMeshPolyhedraActiveColoring,
     setMeshPolyhedraColor,
-    // setPolyhedraPolyhedronAttribute,
-    // setPolyhedraPolygonAttribute,
-    // setPolyhedraVertexAttribute,
+    setPolyhedraPolyhedronAttribute,
+    setPolyhedraVertexAttribute,
     setMeshPolyhedraVisibility,
   }
 }
diff --git a/tests/integration/data/uploads/test.og_edc3d b/tests/integration/data/uploads/test.og_edc3d
new file mode 100644
index 00000000..6dbeaf77
Binary files /dev/null and b/tests/integration/data/uploads/test.og_edc3d differ
diff --git a/tests/integration/data/uploads/test.vtu b/tests/integration/data/uploads/test.vtu
new file mode 100644
index 00000000..7c86fa9c
--- /dev/null
+++ b/tests/integration/data/uploads/test.vtu
@@ -0,0 +1,22 @@
+<?xml version="1.0"?>
+<VTKFile type="UnstructuredGrid" version="1.0" byte_order="LittleEndian" header_type="UInt32" compressor="vtkZLibDataCompressor">
+	<UnstructuredGrid>
+		<Piece NumberOfPoints="11" NumberOfCells="4">
+			<PointData>
+				<DataArray type="Float64" Name="toto_on_vertices" format="ascii" NumberOfComponents="1" RangeMin="1" RangeMax="11">1 2 3 4 5 6 7 8 9 10 11 </DataArray>
+				<DataArray type="Float64" Name="points" format="ascii" NumberOfComponents="3" RangeMin="0" RangeMax="2">0 0 0 1 0 0 2 1 0 1 2 0 0 2 0 0 0 1 1 0 1 2 1 1 1 2 1 0 2 1 1 1 2 </DataArray>
+			</PointData>
+			<Points>
+				<DataArray type="Float64" Name="Points" format="ascii" NumberOfComponents="3" RangeMin="0" RangeMax="2">0 0 0 1 0 0 2 1 0 1 2 0 0 2 0 0 0 1 1 0 1 2 1 1 1 2 1 0 2 1 1 1 2 </DataArray>
+			</Points>
+			<CellData>
+				<DataArray type="Float64" Name="toto_on_polyhedra" format="ascii" NumberOfComponents="1" RangeMin="3" RangeMax="6">3 4 5 6 </DataArray>
+			</CellData>
+			<Cells>
+				<DataArray type="Int64" Name="connectivity" format="ascii" RangeMin="0" RangeMax="10">0 1 3 4 5 6 8 9 1 2 3 6 7 8 5 6 8 9 10 6 7 8 10 </DataArray>
+				<DataArray type="Int64" Name="offsets" format="ascii" RangeMin="0" RangeMax="11">8 14 19 23 </DataArray>
+				<DataArray type="UInt8" Name="types" format="ascii" RangeMin="1" RangeMax="42">12 13 14 10 </DataArray>
+			</Cells>
+		</Piece>
+	</UnstructuredGrid>
+</VTKFile>
diff --git a/tests/integration/microservices/back/requirements.txt b/tests/integration/microservices/back/requirements.txt
index ecd51b9e..bd3a3ef5 100644
--- a/tests/integration/microservices/back/requirements.txt
+++ b/tests/integration/microservices/back/requirements.txt
@@ -5,4 +5,3 @@
 #    pip-compile --output-file=tests/integration/microservices/back/requirements.txt tests/integration/microservices/back/requirements.in
 #
 
-opengeodeweb-back==6.*,>=6.0.0rc1
diff --git a/tests/integration/microservices/viewer/requirements.txt b/tests/integration/microservices/viewer/requirements.txt
index 8293def3..4d097394 100644
--- a/tests/integration/microservices/viewer/requirements.txt
+++ b/tests/integration/microservices/viewer/requirements.txt
@@ -5,4 +5,3 @@
 #    pip-compile --output-file=tests/integration/microservices/viewer/requirements.txt tests/integration/microservices/viewer/requirements.in
 #
 
-opengeodeweb-viewer==1.*,>=1.14.0
diff --git a/tests/integration/stores/data_style/mesh/edges.nuxt.test.js b/tests/integration/stores/data_style/mesh/edges.nuxt.test.js
index 56130974..b2cce4ae 100644
--- a/tests/integration/stores/data_style/mesh/edges.nuxt.test.js
+++ b/tests/integration/stores/data_style/mesh/edges.nuxt.test.js
@@ -15,8 +15,9 @@ import { setupIntegrationTests } from "../../../setup"
 
 // Local constants
 const mesh_edges_schemas = viewer_schemas.opengeodeweb_viewer.mesh.edges
-const file_name = "test.og_edc2d"
-const geode_object = "EdgedCurve2D"
+const mesh_points_schemas = viewer_schemas.opengeodeweb_viewer.mesh.points
+const file_name = "test.og_edc3d"
+const geode_object = "EdgedCurve3D"
 
 let id, back_port, viewer_port, project_folder_path
 
@@ -36,9 +37,9 @@ afterEach(async () => {
   delete_folder_recursive(project_folder_path)
 })
 
-describe("Mesh edges", () => {
-  describe("Edges visibility", () => {
-    test("Visibility true", async () => {
+describe("Mesh EdgedCurve3D", () => {
+  describe("Edges", () => {
+    test("Edges visibility", async () => {
       const dataStyleStore = useDataStyleStore()
       const viewerStore = useViewerStore()
       const visibility = true
@@ -54,10 +55,8 @@ describe("Mesh edges", () => {
       expect(dataStyleStore.meshEdgesVisibility(id)).toBe(visibility)
       expect(viewerStore.status).toBe(Status.CONNECTED)
     })
-  })
 
-  describe("Edges color", () => {
-    test("Color red", async () => {
+    test("Edges color red", async () => {
       const dataStyleStore = useDataStyleStore()
       const viewerStore = useViewerStore()
       const color = { r: 255, g: 0, b: 0 }
@@ -73,13 +72,11 @@ describe("Mesh edges", () => {
       expect(dataStyleStore.meshEdgesColor(id)).toStrictEqual(color)
       expect(viewerStore.status).toBe(Status.CONNECTED)
     })
-  })
 
-  describe("Edges active coloring", () => {
-    test("test coloring", async () => {
+    test("Edges active coloring", async () => {
       const dataStyleStore = useDataStyleStore()
       const viewerStore = useViewerStore()
-      const coloringTypes = ["color"]
+      const coloringTypes = ["color", "vertex", "edge"]
       for (let i = 0; i < coloringTypes.length; i++) {
         dataStyleStore.setMeshEdgesActiveColoring(id, coloringTypes[i])
         expect(dataStyleStore.meshEdgesActiveColoring(id)).toBe(
@@ -88,5 +85,43 @@ describe("Mesh edges", () => {
         expect(viewerStore.status).toBe(Status.CONNECTED)
       }
     })
+
+    test("Edges vertex attribute", async () => {
+      const dataStyleStore = useDataStyleStore()
+      const viewerStore = useViewerStore()
+      const vertex_attribute = { name: "vertex_attribute" }
+      const spy = vi.spyOn(viewerStore, "request")
+      await dataStyleStore.setMeshEdgesVertexAttribute(id, vertex_attribute)
+      expect(spy).toHaveBeenCalledWith(
+        mesh_edges_schemas.vertex_attribute,
+        { id, ...vertex_attribute },
+        {
+          response_function: expect.any(Function),
+        },
+      )
+      expect(dataStyleStore.meshEdgesVertexAttribute(id)).toStrictEqual(
+        vertex_attribute,
+      )
+      expect(viewerStore.status).toBe(Status.CONNECTED)
+    })
+
+    test("Edges edge attribute", async () => {
+      const dataStyleStore = useDataStyleStore()
+      const viewerStore = useViewerStore()
+      const edge_attribute = { name: "edge_attribute" }
+      const spy = vi.spyOn(viewerStore, "request")
+      await dataStyleStore.setMeshEdgesEdgeAttribute(id, edge_attribute)
+      expect(spy).toHaveBeenCalledWith(
+        mesh_edges_schemas.edge_attribute,
+        { id, ...edge_attribute },
+        {
+          response_function: expect.any(Function),
+        },
+      )
+      expect(dataStyleStore.meshEdgesEdgeAttribute(id)).toStrictEqual(
+        edge_attribute,
+      )
+      expect(viewerStore.status).toBe(Status.CONNECTED)
+    })
   })
 })
diff --git a/tests/integration/stores/data_style/mesh/points.nuxt.test.js b/tests/integration/stores/data_style/mesh/points.nuxt.test.js
index 90df2076..7c717ea4 100644
--- a/tests/integration/stores/data_style/mesh/points.nuxt.test.js
+++ b/tests/integration/stores/data_style/mesh/points.nuxt.test.js
@@ -107,5 +107,24 @@ describe("Mesh points", () => {
       expect(dataStyleStore.meshPointsSize(id)).toBe(size)
       expect(viewerStore.status).toBe(Status.CONNECTED)
     })
+
+    test("Points vertex attribute", async () => {
+      const dataStyleStore = useDataStyleStore()
+      const viewerStore = useViewerStore()
+      const vertex_attribute = { name: "points" }
+      const spy = vi.spyOn(viewerStore, "request")
+      await dataStyleStore.setMeshPointsVertexAttribute(id, vertex_attribute)
+      expect(spy).toHaveBeenCalledWith(
+        mesh_points_schemas.vertex_attribute,
+        { id, ...vertex_attribute },
+        {
+          response_function: expect.any(Function),
+        },
+      )
+      expect(dataStyleStore.meshPointsVertexAttribute(id)).toStrictEqual(
+        vertex_attribute,
+      )
+      expect(viewerStore.status).toBe(Status.CONNECTED)
+    })
   })
 })
diff --git a/tests/integration/stores/data_style/mesh/polygons.nuxt.test.js b/tests/integration/stores/data_style/mesh/polygons.nuxt.test.js
index b445d919..7b63dd2c 100644
--- a/tests/integration/stores/data_style/mesh/polygons.nuxt.test.js
+++ b/tests/integration/stores/data_style/mesh/polygons.nuxt.test.js
@@ -15,6 +15,7 @@ import { setupIntegrationTests } from "../../../setup"
 
 // Local constants
 const mesh_polygons_schemas = viewer_schemas.opengeodeweb_viewer.mesh.polygons
+const mesh_points_schemas = viewer_schemas.opengeodeweb_viewer.mesh.points
 const file_name = "test.og_psf3d"
 const geode_object = "PolygonalSurface3D"
 
@@ -23,7 +24,7 @@ let id, back_port, viewer_port, project_folder_path
 beforeEach(async () => {
   ;({ id, back_port, viewer_port, project_folder_path } =
     await setupIntegrationTests(file_name, geode_object))
-}, 20000)
+}, 25000)
 
 afterEach(async () => {
   console.log(
@@ -76,6 +77,21 @@ describe("Mesh polygons", () => {
     })
   })
 
+  describe("Polygons active coloring", () => {
+    test("test coloring", async () => {
+      const dataStyleStore = useDataStyleStore()
+      const viewerStore = useViewerStore()
+      const coloringTypes = ["color", "vertex", "polygon"]
+      for (let i = 0; i < coloringTypes.length; i++) {
+        dataStyleStore.setMeshPolygonsActiveColoring(id, coloringTypes[i])
+        expect(dataStyleStore.meshPolygonsActiveColoring(id)).toBe(
+          coloringTypes[i],
+        )
+        expect(viewerStore.status).toBe(Status.CONNECTED)
+      }
+    })
+  })
+
   describe("Polygons vertex attribute", () => {
     test("Coloring vertex attribute", async () => {
       const dataStyleStore = useDataStyleStore()
@@ -120,19 +136,4 @@ describe("Mesh polygons", () => {
       expect(viewerStore.status).toBe(Status.CONNECTED)
     })
   })
-
-  describe("Polygons active coloring", () => {
-    test("test coloring", async () => {
-      const dataStyleStore = useDataStyleStore()
-      const viewerStore = useViewerStore()
-      const coloringTypes = ["color", "vertex", "polygon"]
-      for (let i = 0; i < coloringTypes.length; i++) {
-        dataStyleStore.setMeshPolygonsActiveColoring(id, coloringTypes[i])
-        expect(dataStyleStore.meshPolygonsActiveColoring(id)).toBe(
-          coloringTypes[i],
-        )
-        expect(viewerStore.status).toBe(Status.CONNECTED)
-      }
-    })
-  })
 })
diff --git a/tests/integration/stores/data_style/mesh/polyhedra.nuxt.test.js b/tests/integration/stores/data_style/mesh/polyhedra.nuxt.test.js
index 63399496..93a75f42 100644
--- a/tests/integration/stores/data_style/mesh/polyhedra.nuxt.test.js
+++ b/tests/integration/stores/data_style/mesh/polyhedra.nuxt.test.js
@@ -15,15 +15,18 @@ import { setupIntegrationTests } from "../../../setup"
 
 // Local constants
 const mesh_polyhedra_schemas = viewer_schemas.opengeodeweb_viewer.mesh.polyhedra
-const file_name = "test.og_rgd3d"
-const geode_object = "RegularGrid3D"
+const mesh_polygons_schemas = viewer_schemas.opengeodeweb_viewer.mesh.polygons
+const mesh_edges_schemas = viewer_schemas.opengeodeweb_viewer.mesh.edges
+const mesh_points_schemas = viewer_schemas.opengeodeweb_viewer.mesh.points
+const file_name = "test.vtu"
+const geode_object = "HybridSolid3D"
 
 let id, back_port, viewer_port, project_folder_path
 
 beforeEach(async () => {
   ;({ id, back_port, viewer_port, project_folder_path } =
     await setupIntegrationTests(file_name, geode_object))
-}, 20000)
+}, 30000)
 
 afterEach(async () => {
   console.log(
@@ -37,8 +40,8 @@ afterEach(async () => {
 })
 
 describe("Mesh polyhedra", () => {
-  describe("Polyhedra visibility", () => {
-    test("Visibility true", async () => {
+  describe("Polyhedra", () => {
+    test("Polyhedra visibility", async () => {
       const dataStyleStore = useDataStyleStore()
       const viewerStore = useViewerStore()
       const visibility = true
@@ -54,12 +57,28 @@ describe("Mesh polyhedra", () => {
       expect(dataStyleStore.meshPolyhedraVisibility(id)).toBe(visibility)
       expect(viewerStore.status).toBe(Status.CONNECTED)
     })
-  })
-  describe("Polyhedra active coloring", () => {
-    test("test coloring", async () => {
+
+    test("Polyhedra color red", async () => {
+      const dataStyleStore = useDataStyleStore()
+      const viewerStore = useViewerStore()
+      const color = { r: 255, g: 0, b: 0 }
+      const spy = vi.spyOn(viewerStore, "request")
+      await dataStyleStore.setMeshPolyhedraColor(id, color)
+      expect(spy).toHaveBeenCalledWith(
+        mesh_polyhedra_schemas.color,
+        { id, color },
+        {
+          response_function: expect.any(Function),
+        },
+      )
+      expect(dataStyleStore.meshPolyhedraColor(id)).toStrictEqual(color)
+      expect(viewerStore.status).toBe(Status.CONNECTED)
+    })
+
+    test("Polyhedra active coloring", async () => {
       const dataStyleStore = useDataStyleStore()
       const viewerStore = useViewerStore()
-      const coloringTypes = ["color"]
+      const coloringTypes = ["color", "vertex", "polyhedron"]
       for (let i = 0; i < coloringTypes.length; i++) {
         dataStyleStore.setMeshPolyhedraActiveColoring(id, coloringTypes[i])
         expect(dataStyleStore.meshPolyhedraActiveColoring(id)).toBe(
@@ -68,23 +87,110 @@ describe("Mesh polyhedra", () => {
         expect(viewerStore.status).toBe(Status.CONNECTED)
       }
     })
+
+    test("Polyhedra vertex attribute", async () => {
+      const dataStyleStore = useDataStyleStore()
+      const viewerStore = useViewerStore()
+      const vertex_attribute = { name: "toto_on_vertices" }
+      const spy = vi.spyOn(viewerStore, "request")
+      await dataStyleStore.setPolyhedraVertexAttribute(id, vertex_attribute)
+      expect(spy).toHaveBeenCalledWith(
+        mesh_polyhedra_schemas.vertex_attribute,
+        { id, ...vertex_attribute },
+        {
+          response_function: expect.any(Function),
+        },
+      )
+      expect(dataStyleStore.polyhedraVertexAttribute(id)).toStrictEqual(
+        vertex_attribute,
+      )
+      expect(viewerStore.status).toBe(Status.CONNECTED)
+    })
+
+    test("Polyhedra polyhedron attribute", async () => {
+      const dataStyleStore = useDataStyleStore()
+      const viewerStore = useViewerStore()
+      const polyhedron_attribute = { name: "toto_on_polyhedra" }
+      const spy = vi.spyOn(viewerStore, "request")
+      await dataStyleStore.setPolyhedraPolyhedronAttribute(
+        id,
+        polyhedron_attribute,
+      )
+      expect(spy).toHaveBeenCalledWith(
+        mesh_polyhedra_schemas.polyhedron_attribute,
+        { id, ...polyhedron_attribute },
+        {
+          response_function: expect.any(Function),
+        },
+      )
+      expect(dataStyleStore.polyhedraPolyhedronAttribute(id)).toStrictEqual(
+        polyhedron_attribute,
+      )
+      expect(viewerStore.status).toBe(Status.CONNECTED)
+    })
   })
-  describe("Polyhedra color", () => {
-    test("Color red", async () => {
+
+  describe("Polygons", () => {
+    test("Polygons color red", async () => {
       const dataStyleStore = useDataStyleStore()
       const viewerStore = useViewerStore()
       const color = { r: 255, g: 0, b: 0 }
       const spy = vi.spyOn(viewerStore, "request")
-      await dataStyleStore.setMeshPolyhedraColor(id, color)
+      await dataStyleStore.setMeshPolygonsColor(id, color)
       expect(spy).toHaveBeenCalledWith(
-        mesh_polyhedra_schemas.color,
+        mesh_polygons_schemas.color,
         { id, color },
         {
           response_function: expect.any(Function),
         },
       )
-      expect(dataStyleStore.meshPolyhedraColor(id)).toStrictEqual(color)
+      expect(dataStyleStore.meshPolygonsColor(id)).toStrictEqual(color)
       expect(viewerStore.status).toBe(Status.CONNECTED)
     })
+
+    test("Polygons active coloring", async () => {
+      const dataStyleStore = useDataStyleStore()
+      const viewerStore = useViewerStore()
+      const coloringTypes = ["color", "vertex", "polygon"]
+      for (let i = 0; i < coloringTypes.length; i++) {
+        dataStyleStore.setMeshPolygonsActiveColoring(id, coloringTypes[i])
+        expect(dataStyleStore.meshPolygonsActiveColoring(id)).toBe(
+          coloringTypes[i],
+        )
+        expect(viewerStore.status).toBe(Status.CONNECTED)
+      }
+    })
+  })
+
+  describe("Edges", () => {
+    test("Edges color red", async () => {
+      const dataStyleStore = useDataStyleStore()
+      const viewerStore = useViewerStore()
+      const color = { r: 255, g: 0, b: 0 }
+      const spy = vi.spyOn(viewerStore, "request")
+      await dataStyleStore.setMeshEdgesColor(id, color)
+      expect(spy).toHaveBeenCalledWith(
+        mesh_edges_schemas.color,
+        { id, color },
+        {
+          response_function: expect.any(Function),
+        },
+      )
+      expect(dataStyleStore.meshEdgesColor(id)).toStrictEqual(color)
+      expect(viewerStore.status).toBe(Status.CONNECTED)
+    })
+
+    test("Edges active coloring", async () => {
+      const dataStyleStore = useDataStyleStore()
+      const viewerStore = useViewerStore()
+      const coloringTypes = ["color", "vertex", "edge"]
+      for (let i = 0; i < coloringTypes.length; i++) {
+        dataStyleStore.setMeshEdgesActiveColoring(id, coloringTypes[i])
+        expect(dataStyleStore.meshEdgesActiveColoring(id)).toBe(
+          coloringTypes[i],
+        )
+        expect(viewerStore.status).toBe(Status.CONNECTED)
+      }
+    })
   })
 })