I’ve changed the Zones to be shaded and made the lines thinner so it should be clearer and less cluttered now. Also with the Plotly graph, you can click on the Legend items to hide them if you only want to look at a specific items. It is also very customisable and is easy to change the colours and line thickness to meet individual needs.
type: custom:plotly-graph
title: Target Positions
refresh_interval: 1
hours_to_show: current_day
layout:
height: 230
margin:
l: 50
r: 20
t: 20
b: 40
showlegend: true
xaxis:
dtick: 1000
gridcolor: RGBA(200,200,200,0.15)
zerolinecolor: RGBA(200,200,200,0.15)
type: number
fixedrange: true
range:
- 4000
- -4000
yaxis:
dtick: 1000
gridcolor: RGBA(200,200,200,0.15)
zerolinecolor: RGBA(200,200,200,0.15)
scaleanchor: x
scaleratio: 1
fixedrange: true
range:
- 6000
- 0
entities:
- entity: ''
name: Target1
marker:
size: 12
line:
shape: spline
width: 5
x:
- $ex hass.states["sensor.screek_human_sensor_2a_734e6c_target1_x"].state
'y':
- $ex hass.states["sensor.screek_human_sensor_2a_734e6c_target1_y"].state
- entity: ''
name: Target2
marker:
size: 12
line:
shape: spline
width: 5
x:
- $ex hass.states["sensor.screek_human_sensor_2a_734e6c_target2_x"].state
'y':
- $ex hass.states["sensor.screek_human_sensor_2a_734e6c_target2_y"].state
- entity: ''
name: Target3
marker:
size: 12
line:
shape: spline
width: 5
x:
- $ex hass.states["sensor.screek_human_sensor_2a_734e6c_target3_x"].state
'y':
- $ex hass.states["sensor.screek_human_sensor_2a_734e6c_target3_y"].state
- entity: ''
name: Zone1
mode: lines
fill: toself
fillcolor: RGBA(20,200,0,0.06)
line:
color: RGBA(20,200,0,0.2)
shape: line
width: 2
x:
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone1_x_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone1_x_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone1_x_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone1_x_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone1_x_begin"].state
'y':
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone1_y_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone1_y_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone1_y_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone1_y_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone1_y_begin"].state
- entity: ''
name: Zone2
mode: lines
fill: toself
fillcolor: RGBA(200,0,255,0.06)
line:
color: RGBA(200,0,255,0.2)
shape: line
width: 2
x:
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone2_x_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone2_x_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone2_x_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone2_x_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone2_x_begin"].state
'y':
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone2_y_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone2_y_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone2_y_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone2_y_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone2_y_begin"].state
- entity: ''
name: Zone3
mode: lines
fill: toself
fillcolor: RGBA(200,120,55,0.06)
line:
color: RGBA(200,120,55,0.2)
shape: line
width: 2
x:
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone3_x_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone3_x_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone3_x_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone3_x_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone3_x_begin"].state
'y':
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone3_y_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone3_y_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone3_y_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone3_y_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zone3_y_begin"].state
- entity: ''
name: ExZone
mode: lines
fill: toself
fillcolor: RGBA(255,0,0,0.15)
line:
shape: line
width: 1
color: RGBA(255,0,0,0.2)
x:
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zout1_x_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zout1_x_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zout1_x_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zout1_x_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zout1_x_begin"].state
'y':
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zout1_y_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zout1_y_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zout1_y_end"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zout1_y_begin"].state
- >-
$ex
hass.states["number.screek_human_sensor_2a_734e6c_zout1_y_begin"].state
- entity: ''
name: Coverage
mode: lines
fill: tonexty
fillcolor: rgba(168, 216, 234, 0.15)
line:
shape: line
width: 1
dash: dot
x:
- 0
- $ex 6000 * Math.sin((2 * Math.PI)/360 * 60)
- 4500
- 4000
- 3000
- 2000
- 1000
- 0
- -1000
- -2000
- -3000
- -4000
- -4500
- $ex -6000 * Math.sin((2 * Math.PI)/360 * 60)
- 0
'y':
- 0
- $ex 6000 * Math.cos((2 * Math.PI)/360 * 60)
- $ex Math.sqrt( 6000**2 - 4500**2 )
- $ex Math.sqrt( 6000**2 - 4000**2 )
- $ex Math.sqrt( 6000**2 - 3000**2 )
- $ex Math.sqrt( 6000**2 - 2000**2 )
- $ex Math.sqrt( 6000**2 - 1000**2 )
- 6000
- $ex Math.sqrt( 6000**2 - 1000**2 )
- $ex Math.sqrt( 6000**2 - 2000**2 )
- $ex Math.sqrt( 6000**2 - 3000**2 )
- $ex Math.sqrt( 6000**2 - 4000**2 )
- $ex Math.sqrt( 6000**2 - 4500**2 )
- $ex 6000 * Math.cos((2 * Math.PI)/360 * 60)
- 0
raw_plotly_config: true
If you use the above config without the layout height set on a Dashboard Panel (1 card), you get to see the whole coverage area map: