diff --git a/frontend/public/apidoc.json b/frontend/public/apidoc.json index abc40bf..77037fb 100644 --- a/frontend/public/apidoc.json +++ b/frontend/public/apidoc.json @@ -190,6 +190,34 @@ "required": true } ] + }, + { + "method": "POST", + "path": "/api/v1/groups/:groupId/devices/:deviceId/actuators/:actuatorId/status", + "description": "Crear un nuevo dispositivo en un grupo", + "params": [ + { + "name": "groupId", + "type": "integer", + "description": "ID del grupo", + "in": "body", + "required": true + }, + { + "name": "deviceId", + "type": "integer", + "description": "ID del dispositivo", + "in": "body", + "required": true + }, + { + "name": "actuatorId", + "type": "string", + "description": "ID del actuador", + "in": "body", + "required": true + } + ] } ], "raw_api": [ diff --git a/frontend/public/voronoi_sevilla_geovoronoi.geojson b/frontend/public/voronoi_sevilla_geovoronoi.geojson index e827652..4818b4e 100644 --- a/frontend/public/voronoi_sevilla_geovoronoi.geojson +++ b/frontend/public/voronoi_sevilla_geovoronoi.geojson @@ -1,727 +1 @@ -{ - "type": "FeatureCollection", - "features": [ - { - "type": "Feature", - "properties": { - "groupId": 3 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.975220574710803, - 37.358725234526325 - ], - [ - -5.956629501395188, - 37.34271453941203 - ], - [ - -5.90939488095618, - 37.339843612523126 - ], - [ - -5.927653856389463, - 37.35123031855536 - ], - [ - -5.9677328204994975, - 37.36945244319422 - ], - [ - -5.975220574710803, - 37.358725234526325 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 5 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.969424709766254, - 37.37478267183256 - ], - [ - -5.963298496465492, - 37.38284229005861 - ], - [ - -5.927653856389463, - 37.35123031855536 - ], - [ - -5.9677328204994975, - 37.36945244319422 - ], - [ - -5.969424709766254, - 37.37478267183256 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 16 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.9062693851557535, - 37.33903066950347 - ], - [ - -5.9402008847769965, - 37.39163172552388 - ], - [ - -5.939432400548112, - 37.41302637751862 - ], - [ - -5.85, - 37.42131204097132 - ], - [ - -5.85, - 37.30641403730114 - ], - [ - -5.9062693851557535, - 37.33903066950347 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 18 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.953484151391864, - 37.45 - ], - [ - -5.892547063477412, - 37.45 - ], - [ - -5.85, - 37.45 - ], - [ - -5.85, - 37.43338874148842 - ], - [ - -5.85, - 37.42131204097132 - ], - [ - -5.939432400548112, - 37.41302637751862 - ], - [ - -5.950157126973102, - 37.42313784097292 - ], - [ - -5.953484151391864, - 37.45 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 2 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -6.042673351034033, - 37.31235131332692 - ], - [ - -5.956629501395188, - 37.34271453941203 - ], - [ - -5.975220574710803, - 37.358725234526325 - ], - [ - -5.991667436508618, - 37.359093048817556 - ], - [ - -6.042673351034033, - 37.31235131332692 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 1 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -6.056335292289438, - 37.30350028295088 - ], - [ - -6.042673351034033, - 37.31235131332692 - ], - [ - -5.956629501395188, - 37.34271453941203 - ], - [ - -5.90939488095618, - 37.339843612523126 - ], - [ - -5.9062693851557535, - 37.33903066950347 - ], - [ - -5.85, - 37.30641403730114 - ], - [ - -5.85, - 37.3 - ], - [ - -6.061145744247712, - 37.3 - ], - [ - -6.056335292289438, - 37.30350028295088 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 6 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -6.006210657955016, - 37.39204750434759 - ], - [ - -5.999699040810209, - 37.38464226854157 - ], - [ - -6.056335292289438, - 37.30350028295088 - ], - [ - -6.061145744247712, - 37.3 - ], - [ - -6.1, - 37.3 - ], - [ - -6.1, - 37.39522072259649 - ], - [ - -6.006210657955016, - 37.39204750434759 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 17 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.996638048161243, - 37.42409467426387 - ], - [ - -6.011677116677642, - 37.45 - ], - [ - -5.953484151391864, - 37.45 - ], - [ - -5.950157126973102, - 37.42313784097292 - ], - [ - -5.965724477190091, - 37.41053204103079 - ], - [ - -5.996638048161243, - 37.42409467426387 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 13 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -6.1, - 37.416037697292964 - ], - [ - -6.1, - 37.45 - ], - [ - -6.057485769579995, - 37.45 - ], - [ - -6.011677116677642, - 37.45 - ], - [ - -5.996638048161243, - 37.42409467426387 - ], - [ - -5.9941297848131985, - 37.406630612305094 - ], - [ - -6.006210657955016, - 37.39204750434759 - ], - [ - -6.1, - 37.39522072259649 - ], - [ - -6.1, - 37.416037697292964 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 12 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.966630745640582, - 37.40714989057746 - ], - [ - -5.953473975522407, - 37.39083552675785 - ], - [ - -5.963175863543545, - 37.38403450765386 - ], - [ - -5.975285181668732, - 37.39565697942774 - ], - [ - -5.966630745640582, - 37.40714989057746 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 10 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.953473975522407, - 37.39083552675785 - ], - [ - -5.9402008847769965, - 37.39163172552388 - ], - [ - -5.9062693851557535, - 37.33903066950347 - ], - [ - -5.90939488095618, - 37.339843612523126 - ], - [ - -5.927653856389463, - 37.35123031855536 - ], - [ - -5.963298496465492, - 37.38284229005861 - ], - [ - -5.963175863543545, - 37.38403450765386 - ], - [ - -5.953473975522407, - 37.39083552675785 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 15 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.966630745640582, - 37.40714989057746 - ], - [ - -5.965724477190091, - 37.41053204103079 - ], - [ - -5.950157126973102, - 37.42313784097292 - ], - [ - -5.939432400548112, - 37.41302637751862 - ], - [ - -5.9402008847769965, - 37.39163172552388 - ], - [ - -5.953473975522407, - 37.39083552675785 - ], - [ - -5.966630745640582, - 37.40714989057746 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 14 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.966630745640582, - 37.40714989057746 - ], - [ - -5.965724477190091, - 37.41053204103079 - ], - [ - -5.996638048161243, - 37.42409467426387 - ], - [ - -5.9941297848131985, - 37.406630612305094 - ], - [ - -5.981314881430654, - 37.393898393584536 - ], - [ - -5.975285181668732, - 37.39565697942774 - ], - [ - -5.966630745640582, - 37.40714989057746 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 8 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.995965602200496, - 37.3834658156984 - ], - [ - -5.990194183397561, - 37.36441485314666 - ], - [ - -5.9792132087914, - 37.37663853816038 - ], - [ - -5.98303912784847, - 37.390051246464104 - ], - [ - -5.995965602200496, - 37.3834658156984 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 4 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.990194183397561, - 37.36441485314666 - ], - [ - -5.991667436508618, - 37.359093048817556 - ], - [ - -5.975220574710803, - 37.358725234526325 - ], - [ - -5.9677328204994975, - 37.36945244319422 - ], - [ - -5.969424709766254, - 37.37478267183256 - ], - [ - -5.9792132087914, - 37.37663853816038 - ], - [ - -5.990194183397561, - 37.36441485314666 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 9 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.98303912784847, - 37.390051246464104 - ], - [ - -5.981314881430654, - 37.393898393584536 - ], - [ - -5.975285181668732, - 37.39565697942774 - ], - [ - -5.963175863543545, - 37.38403450765386 - ], - [ - -5.963298496465492, - 37.38284229005861 - ], - [ - -5.969424709766254, - 37.37478267183256 - ], - [ - -5.9792132087914, - 37.37663853816038 - ], - [ - -5.98303912784847, - 37.390051246464104 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 7 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.995965602200496, - 37.3834658156984 - ], - [ - -5.999699040810209, - 37.38464226854157 - ], - [ - -6.056335292289438, - 37.30350028295088 - ], - [ - -6.042673351034033, - 37.31235131332692 - ], - [ - -5.991667436508618, - 37.359093048817556 - ], - [ - -5.990194183397561, - 37.36441485314666 - ], - [ - -5.995965602200496, - 37.3834658156984 - ] - ] - ] - } - }, - { - "type": "Feature", - "properties": { - "groupId": 11 - }, - "geometry": { - "type": "Polygon", - "coordinates": [ - [ - [ - -5.995965602200496, - 37.3834658156984 - ], - [ - -5.999699040810209, - 37.38464226854157 - ], - [ - -6.006210657955016, - 37.39204750434759 - ], - [ - -5.9941297848131985, - 37.406630612305094 - ], - [ - -5.981314881430654, - 37.393898393584536 - ], - [ - -5.98303912784847, - 37.390051246464104 - ], - [ - -5.995965602200496, - 37.3834658156984 - ] - ] - ] - } - } - ] -} \ No newline at end of file +{"type":"FeatureCollection","features":[{"type":"Feature","properties":{"groupId":3},"geometry":{"coordinates":[[[-5.975220574710803,37.358725234526325],[-5.956629501395188,37.34271453941203],[-5.90939488095618,37.339843612523126],[-5.927653856389463,37.35123031855536],[-5.9677328204994975,37.36945244319422],[-5.975220574710803,37.358725234526325]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":5},"geometry":{"coordinates":[[[-5.969424709766254,37.37478267183256],[-5.963298496465492,37.38284229005861],[-5.927653856389463,37.35123031855536],[-5.9677328204994975,37.36945244319422],[-5.969424709766254,37.37478267183256]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":16},"geometry":{"coordinates":[[[-5.9062693851557535,37.33903066950347],[-5.9402008847769965,37.39163172552388],[-5.939432400548112,37.41302637751862],[-5.85,37.42131204097132],[-5.904792893322883,37.33778673813954],[-5.9062693851557535,37.33903066950347]]],"type":"Polygon"},"id":2},{"type":"Feature","properties":{"groupId":18},"geometry":{"coordinates":[[[-5.953484151391864,37.45],[-5.929844359658734,37.4463048357118],[-5.894162602347398,37.440265381278564],[-5.85,37.43338874148842],[-5.85,37.42131204097132],[-5.939432400548112,37.41302637751862],[-5.950157126973102,37.42313784097292],[-5.953484151391864,37.45]]],"type":"Polygon"},"id":3},{"type":"Feature","properties":{"groupId":2},"geometry":{"coordinates":[[[-6.019818945845138,37.33322271872827],[-6.012841264487632,37.323081224015525],[-5.956629501395188,37.34271453941203],[-5.975220574710803,37.358725234526325],[-5.991667436508618,37.359093048817556],[-6.019818945845138,37.33322271872827]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":1},"geometry":{"coordinates":[[[-5.995804424531988,37.30300909669644],[-6.012446795706033,37.323139332962505],[-5.956629501395188,37.34271453941203],[-5.90939488095618,37.339843612523126],[-5.9062693851557535,37.33903066950347],[-5.905328073248517,37.33820637689736],[-5.915924321468514,37.30206031848657],[-5.933338938840793,37.300829637769084],[-5.970176887698312,37.29360103578427],[-5.985349874187748,37.296430173863286],[-5.995804424531988,37.30300909669644]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":6},"geometry":{"coordinates":[[[-6.006210657955016,37.39204750434759],[-5.999699040810209,37.38464226854157],[-6.023664865508428,37.350376514508525],[-6.023122162698344,37.358878255135636],[-6.023568714785688,37.37549759670348],[-6.01856854601059,37.39290375363919],[-6.006210657955016,37.39204750434759]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":17},"geometry":{"coordinates":[[[-5.996638048161243,37.42409467426387],[-6.011677116677642,37.45],[-5.953484151391864,37.45],[-5.950157126973102,37.42313784097292],[-5.965724477190091,37.41053204103079],[-5.996638048161243,37.42409467426387]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":13},"geometry":{"coordinates":[[[-6.0150603053649885,37.405939858738805],[-6.01351532850291,37.414464068837276],[-6.008420661152496,37.43653032733003],[-6.011677116677642,37.45],[-5.996638048161243,37.42409467426387],[-5.9941297848131985,37.406630612305094],[-6.006210657955016,37.39204750434759],[-6.018491389750357,37.392868856002636],[-6.0150603053649885,37.405939858738805]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":12},"geometry":{"coordinates":[[[-5.966630745640582,37.40714989057746],[-5.953473975522407,37.39083552675785],[-5.963175863543545,37.38403450765386],[-5.975285181668732,37.39565697942774],[-5.966630745640582,37.40714989057746]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":10},"geometry":{"coordinates":[[[-5.953473975522407,37.39083552675785],[-5.9402008847769965,37.39163172552388],[-5.9062693851557535,37.33903066950347],[-5.90939488095618,37.339843612523126],[-5.927653856389463,37.35123031855536],[-5.963298496465492,37.38284229005861],[-5.963175863543545,37.38403450765386],[-5.953473975522407,37.39083552675785]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":15},"geometry":{"coordinates":[[[-5.966630745640582,37.40714989057746],[-5.965724477190091,37.41053204103079],[-5.950157126973102,37.42313784097292],[-5.939432400548112,37.41302637751862],[-5.9402008847769965,37.39163172552388],[-5.953473975522407,37.39083552675785],[-5.966630745640582,37.40714989057746]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":14},"geometry":{"coordinates":[[[-5.966630745640582,37.40714989057746],[-5.965724477190091,37.41053204103079],[-5.996638048161243,37.42409467426387],[-5.9941297848131985,37.406630612305094],[-5.981314881430654,37.393898393584536],[-5.975285181668732,37.39565697942774],[-5.966630745640582,37.40714989057746]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":8},"geometry":{"coordinates":[[[-5.995965602200496,37.3834658156984],[-5.990194183397561,37.36441485314666],[-5.9792132087914,37.37663853816038],[-5.98303912784847,37.390051246464104],[-5.995965602200496,37.3834658156984]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":4},"geometry":{"coordinates":[[[-5.990194183397561,37.36441485314666],[-5.991667436508618,37.359093048817556],[-5.975220574710803,37.358725234526325],[-5.9677328204994975,37.36945244319422],[-5.969424709766254,37.37478267183256],[-5.9792132087914,37.37663853816038],[-5.990194183397561,37.36441485314666]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":9},"geometry":{"coordinates":[[[-5.98303912784847,37.390051246464104],[-5.981314881430654,37.393898393584536],[-5.975285181668732,37.39565697942774],[-5.963175863543545,37.38403450765386],[-5.963298496465492,37.38284229005861],[-5.969424709766254,37.37478267183256],[-5.9792132087914,37.37663853816038],[-5.98303912784847,37.390051246464104]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":7},"geometry":{"coordinates":[[[-5.995965602200496,37.3834658156984],[-5.999699040810209,37.38464226854157],[-6.023428549554685,37.35083573736084],[-6.023579679802672,37.34015122970959],[-6.019841931344267,37.33340175276613],[-5.991667436508618,37.359093048817556],[-5.990194183397561,37.36441485314666],[-5.995965602200496,37.3834658156984]]],"type":"Polygon"}},{"type":"Feature","properties":{"groupId":11},"geometry":{"coordinates":[[[-5.995965602200496,37.3834658156984],[-5.999699040810209,37.38464226854157],[-6.006210657955016,37.39204750434759],[-5.9941297848131985,37.406630612305094],[-5.981314881430654,37.393898393584536],[-5.98303912784847,37.390051246464104],[-5.995965602200496,37.3834658156984]]],"type":"Polygon"}}]} \ No newline at end of file diff --git a/frontend/src/components/PollutionMap.jsx b/frontend/src/components/PollutionMap.jsx index 70b93af..fc4f0dd 100644 --- a/frontend/src/components/PollutionMap.jsx +++ b/frontend/src/components/PollutionMap.jsx @@ -39,8 +39,8 @@ const PollutionMapContent = () => { const { config, configLoading, configError } = useConfig(); const { data, dataLoading, dataError } = useDataContext(); - const mapRef = useRef(null); - const voronoiLayerRef = useRef(null); + const mapRef = useRef(null); + const voronoiLayerRef = useRef(null); const [showVoronoi, setShowVoronoi] = useState(false); useEffect(() => { @@ -60,12 +60,29 @@ const PollutionMapContent = () => { if (!mapContainer) return; const getFillColor = (feature) => { - const index = feature.properties.index || Math.floor(Math.random() * 10); + const index = feature.properties.groupId || Math.floor(Math.random() * 10); const colors = [ - "#FFCDD2", "#F8BBD0", "#E1BEE7", "#D1C4E9", - "#C5CAE9", "#B3E5FC", "#B2DFDB", "#DCEDC8", - "#FFF9C4", "#FFE0B2" + "#EF5350", // rojo coral + "#EC407A", // rosa fucsia + "#AB47BC", // púrpura + "#7E57C2", // violeta oscuro + "#5C6BC0", // azul medio + "#42A5F5", // azul claro + "#29B6F6", // celeste intenso + "#26C6DA", // azul verdoso + "#26A69A", // verde azulado + "#66BB6A", // verde hoja + "#9CCC65", // verde lima + "#D4E157", // lima amarillenta + "#FFEE58", // amarillo mostaza + "#FFCA28", // amarillo dorado + "#FFA726", // naranja quemado + "#FF7043", // naranja rojizo + "#8D6E63", // marrón topo + "#78909C" // gris azulado ]; + + return colors[index % colors.length]; }; diff --git a/frontend/src/css/Card.css b/frontend/src/css/Card.css index 7633a17..f05a38e 100644 --- a/frontend/src/css/Card.css +++ b/frontend/src/css/Card.css @@ -57,11 +57,9 @@ } .contenedor-con-efecto { - background-color: #000; /* Fondo oscuro, similar al de la imagen */ - background-image: radial-gradient(#313131aa 3px, transparent 0.5px); /* Puntos muy sutiles, casi invisibles */ - background-size: 8px 8px; /* Controla la separación de los puntos */ - /* Ajusta estos valores para cambiar el tamaño y la densidad de los puntos */ - /* Los colores de los puntos pueden ser un azul muy oscuro, casi negro, o el mismo negro del fondo para un efecto muy sutil. */ + background-color: #000; + background-image: radial-gradient(#313131aa 3px, transparent 0.5px); + background-size: 8px 8px; } p.card-text {