Battery Level Pie Chart

Description

This example shows how to retrieve entities and display their battery level as a Pie Chart within the table row.

Code

var builder = $api.entitiesSearchBuilder().limit(100).flattened();

// Handle generic filter if present
if (filters && filters.generic) {
    builder.filter({
        like: {
            'provision.administration.identifier': filters.generic
        }
    });
}

var response = await builder.build().execute();

var results = [];
if (response && response.data && response.data.entities) {
    response.data.entities.forEach(function(entity) {
        // Get identifier
        var id = entity['provision.administration.identifier'] ? entity['provision.administration.identifier']._value._current.value : "Unknown";
        
        // Get battery charge (default to 0 if not present)
        var charge = 0;
        if (entity['device.powersupply.battery.charge']) {
            charge = entity['device.powersupply.battery.charge']._value._current.value;
        }

        // Create the chart configuration
        var pieOption = {
            color: ['#91c7ae', '#c23531'],
            series: [
                {
                    type: 'pie',
                    radius: ['50%', '70%'],
                    avoidLabelOverlap: false,
                    label: {
                        show: false,
                        position: 'center'
                    },
                    emphasis: {
                        label: {
                            show: true,
                            fontSize: '10',
                            fontWeight: 'bold'
                        }
                    },
                    labelLine: {
                        show: false
                    },
                    data: [
                        { value: charge, name: 'Charge' },
                        { value: 100 - charge, name: 'Empty' }
                    ]
                }
            ]
        };

        results.push({
            identifier: id,
            battery: {
                "_chart": pieOption,
                "_style": "height: 50px; width: 50px;" // Optional styling for the cell
            }
        });
    });
}

return results;