Ce qu'il vous faut
- Home Assistant, avec l'extension button-card installée depuis HACS (catégorie Frontend).
- Les données de votre Xpeng dans Home Assistant : l'application XPENG Direct, le dongle WiCAN Pro, ou les deux. Le tutoriel Xpeng explique comment faire.
- La carte prend les données de XPENG Direct quand elles ont moins de 30 minutes, sinon celles du WiCAN. Une entité manquante s'affiche « — » sans rien casser.
1Installer la carte
- Collez la carte principaleTableau de bord → modifier → ajouter une carte → Manuel, puis collez le code de la section suivante.
- Réglez les variablesLe bloc
variables, en haut du code, regroupe tout ce qui dépend de votre installation (tableau plus bas). Le plus important estapp: chez moi, les entités de XPENG Direct s'appellentsensor.xpeng_vehicle_0000_soc. Reprenez le début de leur nom, avant_soc. - Ajoutez le diagnostic (facultatif)Une seconde carte, à coller de la même façon, affiche les températures, les tensions de cellules et le 12 V lus par le WiCAN.
La carte principale
État de charge, autonomie, charge en cours, verrouillage, câble, température du habitacle, pneus et vitres.
type: custom:button-card
show_name: false
show_icon: false
show_state: false
show_label: true
tap_action:
action: none
hold_action:
action: none
triggers_update: all
grid_options:
columns: full
variables:
nom: Xpeng G6 # nom affiché en haut de la carte
image: https://wattbudget.fr/assets/ha/xpeng-g6.webp # photo de la voiture ; '' pour aucune, ou /local/… (dossier config/www)
capacite_kwh: 80.8 # capacité de la batterie (80,8 kWh sur les G6 2026), pour estimer les kWh manquants
pression_min: 2.3 # plage de pression des pneus jugée normale (bar)
pression_max: 2.8
app: xpeng_vehicle_0000 # début du nom de vos entités XPENG Direct (sensor.xpeng_vehicle_0000_soc…)
wican_soc: sensor.xpeng_g6_soc # entités du WiCAN (noms proposés dans le tutoriel Xpeng)
wican_temp_min: sensor.xpeng_g6_temperature_batterie_min
wican_temp_max: sensor.xpeng_g6_temperature_batterie_max
wican_cell_min: sensor.xpeng_g6_tension_cellule_min
wican_cell_max: sensor.xpeng_g6_tension_cellule_max
wican_12v: sensor.xpeng_g6_tension_12v
wican_courant: sensor.xpeng_g6_courant_batterie
wican_odometre: sensor.xpeng_g6_odometre_fiable
extra_styles: >-
@keyframes g6mv { to { background-position: 26px 0; } }
@keyframes g6pulse { 50% { opacity: .4; } }
.g6halo { animation: g6pulse 2.4s ease-in-out infinite; }
@keyframes g6pl { 50% { opacity: .7; } }
styles:
card:
- background: |
[[[
const V = variables;
const s0 = parseFloat((((Date.now() - new Date(states['sensor.' + V.app + '_last_seen']?.state || 0).getTime()) < 1800000) ? states['sensor.' + V.app + '_soc']?.state : null) ?? states[V.wican_soc]?.state);
const s = isNaN(s0) ? 76 : Math.max(0, Math.min(100, s0));
const S = [[0, [255, 93, 93]], [25, [255, 138, 61]], [45, [247, 209, 84]], [70, [61, 220, 151]], [100, [79, 163, 255]]];
let c = [79, 163, 255];
for (let i = 1; i < S.length; i++) { if (s <= S[i][0]) { const t = (s - S[i - 1][0]) / (S[i][0] - S[i - 1][0]); c = S[i - 1][1].map((x, j) => Math.round(x + (S[i][1][j] - x) * t)); break; } }
return 'radial-gradient(60% 190px at 50% 0, rgba(' + c.join(',') + ',0.14), transparent 75%), #1c1f24';
]]]
- border: 1px solid #2b3038
- border-radius: 18px
- padding: 16px
- box-shadow: none
- overflow: hidden
- pointer-events: auto
label:
- width: 100%
- text-align: left
- white-space: normal
- justify-self: stretch
- pointer-events: auto
label: |
[[[
const V = variables;
const S = e => states[e]?.state;
const N = e => { const x = parseFloat(S(e)); return isNaN(x) ? null : x; };
const lang = String(hass.language || 'fr').slice(0, 2);
const PC = lang === 'en' ? '%' : ' %';
const fr = (x, d) => x === null ? '—' : x.toFixed(d).replace('.', lang === 'en' ? '.' : ',');
const TT = {
fr: { charging: 'En charge', driving: 'En route', asleep: 'En veille', parked: 'Garée', home: 'À la maison', away: 'Hors domicile', seen: 'vu', nodata: 'pas de donnée', now: "à l'instant", ago: (n, u) => 'il y a ' + n + ' ' + u, d: 'j', target: 'Cible', targetIn: (t, d) => t + PC + ' dans ' + d, maxAt: k => 'Max ' + k + ' km à 100 %', missing: k => 'manque ' + k + ' kWh', locked: 'Verrouillée', unlocked: 'Déverrouillée', plugged: 'Branchée', unplugged: 'Non branchée', online: 'En ligne', offline: 'Hors ligne', homeChip: 'Maison', lvl: ['Critique', 'Bas', 'Moyen', 'Bon', 'Plein'], cabin: 'Habitacle', hv: 'Batt. HV', odo: 'Odomètre', tw: 'Pneus et vitres', closed: 'fermée', open: p => 'ouv. ' + p + ' %', ok: 'Tout est OK', tyres: n => n + ' pneu' + (n > 1 ? 's' : '') + ' à vérifier', wins: n => n + ' vitre' + (n > 1 ? 's' : '') + ' ouverte' + (n > 1 ? 's' : ''), hist: 'Historique de la batterie' },
en: { charging: 'Charging', driving: 'Driving', asleep: 'Asleep', parked: 'Parked', home: 'At home', away: 'Away from home', seen: 'seen', nodata: 'no data', now: 'just now', ago: (n, u) => n + ' ' + u + ' ago', d: 'd', target: 'Target', targetIn: (t, d) => t + PC + ' in ' + d, maxAt: k => 'Max ' + k + ' km at 100%', missing: k => k + ' kWh missing', locked: 'Locked', unlocked: 'Unlocked', plugged: 'Plugged in', unplugged: 'Unplugged', online: 'Online', offline: 'Offline', homeChip: 'Home', lvl: ['Critical', 'Low', 'Medium', 'Good', 'Full'], cabin: 'Cabin', hv: 'HV batt.', odo: 'Odometer', tw: 'Tyres and windows', closed: 'closed', open: p => 'open ' + p + '%', ok: 'All good', tyres: n => n + ' tyre' + (n > 1 ? 's' : '') + ' to check', wins: n => n + ' window' + (n > 1 ? 's' : '') + ' open', hist: 'Battery history' },
es: { charging: 'Cargando', driving: 'En marcha', asleep: 'En reposo', parked: 'Aparcado', home: 'En casa', away: 'Fuera de casa', seen: 'visto', nodata: 'sin datos', now: 'ahora mismo', ago: (n, u) => 'hace ' + n + ' ' + u, d: 'd', target: 'Objetivo', targetIn: (t, d) => t + PC + ' en ' + d, maxAt: k => 'Máx. ' + k + ' km al 100 %', missing: k => 'faltan ' + k + ' kWh', locked: 'Bloqueado', unlocked: 'Desbloqueado', plugged: 'Conectado', unplugged: 'Desconectado', online: 'En línea', offline: 'Sin conexión', homeChip: 'Casa', lvl: ['Crítico', 'Bajo', 'Medio', 'Bueno', 'Lleno'], cabin: 'Habitáculo', hv: 'Bat. AV', odo: 'Cuentakm', tw: 'Neumáticos y ventanillas', closed: 'cerrada', open: p => 'abierta ' + p + ' %', ok: 'Todo correcto', tyres: n => n + ' neumático' + (n > 1 ? 's' : '') + ' a revisar', wins: n => n + ' ventanilla' + (n > 1 ? 's' : '') + ' abierta' + (n > 1 ? 's' : ''), hist: 'Historial de la batería' },
de: { charging: 'Lädt', driving: 'Unterwegs', asleep: 'Standby', parked: 'Geparkt', home: 'Zu Hause', away: 'Nicht zu Hause', seen: 'zuletzt gesehen', nodata: 'keine Daten', now: 'gerade eben', ago: (n, u) => 'vor ' + n + ' ' + u, d: 'T', target: 'Ziel', targetIn: (t, d) => t + PC + ' in ' + d, maxAt: k => 'Max. ' + k + ' km bei 100 %', missing: k => 'es fehlen ' + k + ' kWh', locked: 'Verriegelt', unlocked: 'Entriegelt', plugged: 'Angesteckt', unplugged: 'Nicht angesteckt', online: 'Online', offline: 'Offline', homeChip: 'Zuhause', lvl: ['Kritisch', 'Niedrig', 'Mittel', 'Gut', 'Voll'], cabin: 'Innenraum', hv: 'HV-Akku', odo: 'Kilometer', tw: 'Reifen und Fenster', closed: 'geschlossen', open: p => 'offen ' + p + ' %', ok: 'Alles in Ordnung', tyres: n => n + ' Reifen prüfen', wins: n => n + ' Fenster offen', hist: 'Akkuverlauf' }
};
const T = TT[lang] || TT.en;
const P = 'sensor.' + V.app + '_', B = 'binary_sensor.' + V.app + '_';
const fresh = (Date.now() - new Date(S(P + 'last_seen') || 0).getTime()) < 1800000;
const soc = (fresh ? N(P + 'soc') : null) ?? N(V.wican_soc);
const socV = soc === null ? 0 : Math.max(0, Math.min(100, soc));
const rng = fresh ? N(P + 'range') : ((N(P + 'range') !== null && N(P + 'soc') && soc !== null) ? N(P + 'range') * soc / N(P + 'soc') : null);
const tgt = (fresh ? N(P + 'targetsoc') : null) ?? 100;
const miss = fresh ? N(P + 'estimated_kwh_missing') : (soc !== null ? Math.max(0, (tgt - soc) / 100 * V.capacite_kwh) : null);
const online = S(B + 'direct_online') === 'on';
const cable = S(B + 'cable_connected') === 'on';
const locked = S(B + 'driver_door_lock') === 'off';
const charging = S(B + 'charging') === 'on';
const pw = N(P + 'charge_power');
const rem = N(P + 'charge_remaining');
const spd = N(P + 'speed') || 0;
const driving = !charging && spd > 3;
const la = N(P + 'latitude'), lo = N(P + 'longitude');
const hz = states['zone.home']?.attributes;
let home = null;
if (la !== null && lo !== null && hz) {
const dLa = (la - hz.latitude) * 111320, dLo = (lo - hz.longitude) * 111320 * Math.cos(hz.latitude * Math.PI / 180);
home = Math.sqrt(dLa * dLa + dLo * dLo) < 200;
}
const seen = S(P + 'last_seen');
const age = seen ? Math.round((Date.now() - new Date(seen).getTime()) / 60000) : null;
const ageTxt = age === null ? T.nodata : age < 1 ? T.now : age < 60 ? T.ago(age, 'min') : age < 1440 ? T.ago(Math.round(age / 60), 'h') : T.ago(Math.round(age / 1440), T.d);
const C = { g: '#3ddc97', am: '#f5a524', rd: '#ff5d5d', bl: '#4fa3ff', yl: '#f7d154', vi: '#b18cff', or: '#ff8a3d', mu: '#8a919c' };
const STOPS = [[0, [255, 93, 93]], [25, [255, 138, 61]], [45, [247, 209, 84]], [70, [61, 220, 151]], [100, [79, 163, 255]]];
const colAt = s => { for (let i = 1; i < STOPS.length; i++) { if (s <= STOPS[i][0]) { const a = STOPS[i - 1], b = STOPS[i], t = (s - a[0]) / (b[0] - a[0]); return '#' + a[1].map((v, j) => Math.round(v + (b[1][j] - v) * t).toString(16).padStart(2, '0')).join(''); } } return '#4fa3ff'; };
const sc = colAt(socV);
const lvl = T.lvl[socV < 20 ? 0 : socV < 40 ? 1 : socV < 60 ? 2 : socV <= 90 ? 3 : 4];
const mix = (c, a) => c + Math.round(a * 255).toString(16).padStart(2, '0');
const IC = (ic, n, c) => '<span style="width:' + n + 'px;height:' + n + 'px;flex:none;display:inline-flex;overflow:hidden;align-items:center;justify-content:center;line-height:0"><ha-icon icon="' + ic + '" style="--mdc-icon-size:' + n + 'px' + (c ? ';color:' + c : '') + '"></ha-icon></span>';
let st, stIc, stC;
if (charging) { st = T.charging + (pw ? ' ' + fr(pw, 1) + ' kW' : ''); stIc = 'mdi:lightning-bolt'; stC = C.g; }
else if (driving) { st = T.driving; stIc = 'mdi:steering'; stC = C.bl; }
else if (!online) { st = T.asleep; stIc = 'mdi:sleep'; stC = C.mu; }
else { st = T.parked; stIc = 'mdi:parking'; stC = C.vi; }
const where = home === null ? '' : home ? T.home : T.away;
const sub = where + (where ? ' · ' : '') + (driving ? Math.round(spd) + ' km/h' : (age === null ? T.nodata : T.seen + ' ' + ageTxt));
let line;
if (charging) {
line = rem ? T.targetIn(Math.round(tgt), rem >= 60 ? Math.floor(rem / 60) + ' h ' + String(rem % 60).padStart(2, '0') : rem + ' min') : T.target + ' ' + Math.round(tgt) + PC;
} else if (driving) {
line = T.maxAt(fr(N(P + 'max_range'), 0));
} else {
line = T.target + ' ' + Math.round(tgt) + PC + (miss !== null && miss > 0 ? ' · ' + T.missing(fr(miss, 1)) : '');
}
const chip = (ic, t, c) => '<span style="display:inline-flex;align-items:center;gap:5px;border-radius:20px;padding:4px 10px;font-size:12px;margin:0 4px 5px 0;background:' + mix(c, 0.14) + ';color:' + c + '">' + IC(ic, 15) + t + '</span>';
let chips = '';
chips += locked ? chip('mdi:lock', T.locked, C.g) : chip('mdi:lock-open-variant', T.unlocked, C.am);
if (charging) chips += chip('mdi:ev-plug-type2', pw ? fr(pw, 1) + ' kW' : T.charging, C.yl);
else chips += cable ? chip('mdi:power-plug', T.plugged, C.bl) : chip('mdi:power-plug-off', T.unplugged, C.mu);
chips += online ? chip('mdi:wifi', T.online, C.g) : chip('mdi:wifi-off', T.offline, C.mu);
if (home) chips += chip('mdi:home', T.homeChip, C.vi);
const tile = (ic, k, v, c, vc) => '<div style="background:#252a31;border-radius:12px;padding:8px 10px;min-width:0;text-align:center;border-top:2px solid ' + c + '"><div style="font-size:11px;color:' + C.mu + ';display:flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap">' + IC(ic, 14, c) + '<span>' + k + '</span></div><div style="font-size:14px;font-weight:500;white-space:nowrap;margin-top:3px;text-align:center;color:' + (vc || '#e8eaed') + '">' + v + '</div></div>';
const tMin = N(V.wican_temp_min), tMax = N(V.wican_temp_max);
const tb = tMin === null ? '—' : (tMin === tMax ? fr(tMin, 0) : fr(tMin, 0) + '–' + fr(tMax, 0)) + ' °C';
const v12 = N(V.wican_12v);
const odo = N(V.wican_odometre) ?? N(P + 'odometer');
const odoTxt = odo === null ? '—' : Math.round(odo).toLocaleString(lang) + ' km';
const W = { fl: 'front_left', fr: 'front_right', rl: 'rear_left', rr: 'rear_right' };
let nWin = 0, nTyre = 0;
const pill = k => {
const p = N(P + W[k] + '_tire_pressure'), w = N(P + W[k] + '_window_position');
const pOk = p !== null && p >= V.pression_min && p <= V.pression_max, wOk = w === null || w >= 100;
if (!pOk) nTyre++; if (!wOk) nWin++;
const pc = pOk ? C.g : C.am, wc = wOk ? C.g : C.am;
const wt = w === null ? '—' : wOk ? T.closed : T.open(Math.round(100 - w));
return { pc: pc, wc: wc, h: '<div style="display:flex;align-items:center;gap:6px;background:#252a31;border-radius:10px;padding:6px 8px;font-size:13px"><span style="width:8px;height:8px;border-radius:50%;background:' + pc + ';flex:none"></span><b style="font-weight:500">' + fr(p, 2) + '</b><span style="color:' + C.mu + ';font-size:11px;margin-left:auto;display:flex;align-items:center;gap:3px;white-space:nowrap">' + IC('mdi:car-door', 13, wc) + wt + '</span></div>' };
};
const q = { fl: pill('fl'), fr: pill('fr'), rl: pill('rl'), rr: pill('rr') };
const sumTxt = (nTyre === 0 && nWin === 0) ? T.ok : [nTyre ? T.tyres(nTyre) : '', nWin ? T.wins(nWin) : ''].filter(x => x).join(' · ');
const sumC = (nTyre === 0 && nWin === 0) ? C.g : C.am;
const SEC = 'background:#20242a;border:1px solid #2b3038;border-radius:14px;padding:10px 12px;margin-top:10px';
const H4 = (ic, t, r, rc) => '<div style="display:flex;justify-content:space-between;align-items:center;font-size:12px;color:' + C.mu + ';margin-bottom:8px"><span style="display:flex;align-items:center;gap:5px">' + IC(ic, 15) + t + '</span><span style="color:' + rc + '">' + r + '</span></div>';
const MORE = 'onclick="event.stopPropagation();this.dispatchEvent(new CustomEvent(\'hass-more-info\',{bubbles:true,composed:true,detail:{entityId:\'' + P + 'soc\'}}))" title="' + T.hist + '"';
let H = '<div style="color:#e8eaed;font-size:13px;line-height:1.35">';
H += '<div style="display:flex;justify-content:space-between;align-items:flex-start"><div><div style="font-size:18px;font-weight:500">' + V.nom + '</div><div style="font-size:12px;color:' + C.mu + '">' + sub + '</div></div>';
H += '<span style="font-size:12px;padding:3px 10px;border-radius:20px;background:' + mix(stC, 0.18) + ';color:' + stC + ';display:inline-flex;gap:4px;align-items:center;white-space:nowrap">' + IC(stIc, 14) + st + '</span></div>';
if (V.image) {
H += '<div style="position:relative;margin:4px 0 0">';
if (charging) H += '<div class="g6halo" style="position:absolute;left:8%;right:8%;bottom:0;height:26%;border-radius:50%;background:radial-gradient(closest-side,' + mix(sc, 0.6) + ',transparent)"></div>';
H += '<img src="' + V.image + '" style="width:100%;max-width:460px;display:block;margin:0 auto;position:relative"></div>';
} else { H += '<div style="height:10px"></div>'; }
H += '<div ' + MORE + ' style="display:flex;align-items:baseline;gap:10px;white-space:nowrap;cursor:pointer"><span style="font-size:34px;font-weight:500;line-height:1;color:' + sc + '">' + (soc === null ? '—' : Math.round(soc) + PC) + '</span><span style="font-size:16px">' + (rng === null ? '' : fr(rng, 0) + ' km') + '</span><span style="font-size:12px;margin-left:auto;color:' + sc + '">' + lvl + '</span></div>';
H += '<div style="font-size:12px;color:' + C.mu + ';margin:5px 0 7px">' + line + '</div>';
const SPEC = 'linear-gradient(90deg,#ff5d5d 0%,#ff8a3d 25%,#f7d154 45%,#3ddc97 70%,#4fa3ff 100%)';
H += '<div ' + MORE + ' style="position:relative;height:12px;margin:2px 0 4px;cursor:pointer">';
H += '<div style="position:absolute;inset:0;border-radius:6px;overflow:hidden"><div style="position:absolute;inset:0;background:' + SPEC + '"></div>';
if (charging) H += '<div style="position:absolute;top:0;bottom:0;left:0;width:' + socV + '%;background:repeating-linear-gradient(110deg,rgba(255,255,255,.22) 0 8px,transparent 8px 20px);background-size:26px 100%;animation:g6mv .9s linear infinite"></div>';
H += '<div style="position:absolute;top:0;bottom:0;right:0;width:' + (100 - socV) + '%;background:#252a31"></div></div>';
H += '<div style="position:absolute;top:-1px;bottom:-1px;left:calc(' + Math.min(100, tgt) + '% - 1px);width:2px;background:#ffffff66;border-radius:1px"></div>';
H += '<div style="position:absolute;top:-3px;bottom:-3px;left:calc(' + socV + '% - 2px);width:4px;border-radius:2px;background:#fff;box-shadow:0 0 8px #fff' + (charging ? ';animation:g6pl 1.6s ease-in-out infinite' : '') + '"></div></div>';
H += '<div style="display:flex;justify-content:space-between;font-size:10px;color:#5d646e;margin-bottom:10px"><span>0</span><span>20</span><span>40</span><span>60</span><span>80</span><span>100</span></div>';
H += '<div>' + chips + '</div>';
H += '<div style="display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:5px">';
H += tile('mdi:car-seat', T.cabin, fr(N(P + 'interior_temp'), 0) + ' °C', C.or);
H += tile('mdi:battery-high', T.hv, tb, C.bl);
H += tile('mdi:car-battery', '12 V', fr(v12, 1) + ' V', C.yl, v12 !== null && v12 < 12.2 ? C.rd : null);
H += tile('mdi:counter', T.odo, odoTxt, C.vi);
H += '</div>';
H += '<div style="' + SEC + '">' + H4('mdi:tire', T.tw, sumTxt, sumC);
H += '<div style="display:grid;grid-template-columns:minmax(0,1fr) 92px minmax(0,1fr);gap:8px;align-items:stretch">';
H += '<div style="display:flex;flex-direction:column;justify-content:space-between;padding:16px 0 10px">' + q.fl.h + q.rl.h + '</div>';
H += '<svg viewBox="0 0 92 150" width="92"><rect x="22" y="8" width="48" height="134" rx="22" fill="#2b3038" stroke="#3a414b"/><rect x="28" y="36" width="36" height="24" rx="6" fill="#14171b"/><rect x="28" y="98" width="36" height="20" rx="6" fill="#14171b"/>';
H += '<rect x="22" y="62" width="4" height="16" rx="2" fill="' + q.fl.wc + '"/><rect x="66" y="62" width="4" height="16" rx="2" fill="' + q.fr.wc + '"/><rect x="22" y="82" width="4" height="14" rx="2" fill="' + q.rl.wc + '"/><rect x="66" y="82" width="4" height="14" rx="2" fill="' + q.rr.wc + '"/>';
H += '<rect x="14" y="28" width="9" height="22" rx="3" fill="' + q.fl.pc + '"/><rect x="69" y="28" width="9" height="22" rx="3" fill="' + q.fr.pc + '"/><rect x="14" y="104" width="9" height="22" rx="3" fill="' + q.rl.pc + '"/><rect x="69" y="104" width="9" height="22" rx="3" fill="' + q.rr.pc + '"/>';
H += '<text x="46" y="20" text-anchor="middle" fill="#8a919c" font-size="9">▲</text></svg>';
H += '<div style="display:flex;flex-direction:column;justify-content:space-between;padding:16px 0 10px">' + q.fr.h + q.rr.h + '</div>';
H += '</div></div>';
return H + '</div>';
]]]Diagnostic de la batterie (WiCAN)
Facultatif. Courant haute tension, températures, tensions de cellules, 12 V. Nécessite les entités du WiCAN.
type: custom:button-card
show_name: false
show_icon: false
show_state: false
show_label: true
tap_action:
action: none
hold_action:
action: none
triggers_update: all
grid_options:
columns: full
variables:
wican_soc: sensor.xpeng_g6_soc # entités du WiCAN (noms proposés dans le tutoriel Xpeng)
wican_temp_min: sensor.xpeng_g6_temperature_batterie_min
wican_temp_max: sensor.xpeng_g6_temperature_batterie_max
wican_cell_min: sensor.xpeng_g6_tension_cellule_min
wican_cell_max: sensor.xpeng_g6_tension_cellule_max
wican_12v: sensor.xpeng_g6_tension_12v
wican_courant: sensor.xpeng_g6_courant_batterie
styles:
card:
- background: '#1c1f24'
- border: 1px solid #2b3038
- border-radius: 18px
- padding: 16px
- box-shadow: none
- overflow: hidden
label:
- width: 100%
- text-align: left
- white-space: normal
- justify-self: stretch
label: |
[[[
const V = variables;
const S = e => states[e]?.state;
const N = e => { const x = parseFloat(S(e)); return isNaN(x) ? null : x; };
const lang = String(hass.language || 'fr').slice(0, 2);
const fr = (x, d) => (x === null || isNaN(x)) ? '—' : x.toFixed(d).replace('.', lang === 'en' ? '.' : ',');
const TT = {
fr: { title: 'Diagnostic batterie', nodata: 'pas de donnée', upd: n => 'maj il y a ' + n + ' min', hvOn: 'HV active', hvOff: 'HV en veille', cur: 'Courant HV', tmin: 'Temp. min', tmax: 'Temp. max', cmin: 'Cellule min', cmax: 'Cellule max', spread: 'Écart cellules', note: "Lecture directe OBD par le WiCAN Pro (MQTT), complétée par XPENG Direct pour les portes, vitres, pneus et la position. L'état de santé (SOH) et la tension du pack ne sont pas exposés." },
en: { title: 'Battery diagnostics', nodata: 'no data', upd: n => 'updated ' + n + ' min ago', hvOn: 'HV active', hvOff: 'HV asleep', cur: 'HV current', tmin: 'Min temp.', tmax: 'Max temp.', cmin: 'Min cell', cmax: 'Max cell', spread: 'Cell spread', note: 'Read straight from the OBD port by the WiCAN Pro (MQTT), with XPENG Direct adding doors, windows, tyres and position. State of health (SOH) and pack voltage are not exposed.' },
es: { title: 'Diagnóstico de la batería', nodata: 'sin datos', upd: n => 'actualizado hace ' + n + ' min', hvOn: 'AV activa', hvOff: 'AV en reposo', cur: 'Corriente AV', tmin: 'Temp. mín.', tmax: 'Temp. máx.', cmin: 'Celda mín.', cmax: 'Celda máx.', spread: 'Dif. celdas', note: 'Lectura directa del OBD con el WiCAN Pro (MQTT), completada con XPENG Direct para puertas, ventanillas, neumáticos y posición. El estado de salud (SOH) y la tensión del pack no están disponibles.' },
de: { title: 'Akku-Diagnose', nodata: 'keine Daten', upd: n => 'aktualisiert vor ' + n + ' Min.', hvOn: 'HV aktiv', hvOff: 'HV im Standby', cur: 'HV-Strom', tmin: 'Temp. min.', tmax: 'Temp. max.', cmin: 'Zelle min.', cmax: 'Zelle max.', spread: 'Zellspreizung', note: 'Direkt über den OBD-Anschluss vom WiCAN Pro gelesen (MQTT), ergänzt durch XPENG Direct für Türen, Fenster, Reifen und Position. Gesundheitszustand (SOH) und Packspannung sind nicht verfügbar.' }
};
const T = TT[lang] || TT.en;
const C = { g: '#3ddc97', am: '#f5a524', rd: '#ff5d5d', bl: '#4fa3ff', yl: '#f7d154', vi: '#b18cff', or: '#ff8a3d', mu: '#8a919c' };
const mix = (c, a) => c + Math.round(a * 255).toString(16).padStart(2, '0');
const IC = (ic, n, c) => '<span style="width:' + n + 'px;height:' + n + 'px;flex:none;display:inline-flex;overflow:hidden;align-items:center;justify-content:center;line-height:0"><ha-icon icon="' + ic + '" style="--mdc-icon-size:' + n + 'px' + (c ? ';color:' + c : '') + '"></ha-icon></span>';
const tile = (ic, k, val, c, vc) => '<div style="background:#252a31;border-radius:12px;padding:8px 6px;min-width:0;text-align:center;border-top:2px solid ' + c + '"><div style="font-size:11px;color:#8a919c;display:flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap">' + IC(ic, 14, c) + '<span>' + k + '</span></div><div style="font-size:15px;font-weight:500;white-space:nowrap;margin-top:3px;color:' + (vc || '#e8eaed') + '">' + val + '</div></div>';
const grid = (n, a) => '<div style="display:grid;grid-template-columns:repeat(' + n + ',minmax(0,1fr));gap:8px;margin-top:10px">' + a.join('') + '</div>';
const badge = (t, ic, c) => '<span style="margin-left:auto;font-size:12px;padding:3px 10px;border-radius:20px;background:' + mix(c, .18) + ';color:' + c + ';display:inline-flex;gap:4px;align-items:center;white-space:nowrap">' + IC(ic, 14) + '<span>' + t + '</span></span>';
const hd = (ic, c, t, s, b) => '<div style="display:flex;align-items:center;gap:10px"><div style="width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:' + mix(c, .18) + ';flex:none">' + IC(ic, 19, c) + '</div><div style="min-width:0"><div style="font-size:15px;font-weight:500">' + t + '</div><div style="font-size:12px;color:#8a919c">' + s + '</div></div>' + (b || '') + '</div>';
const tMin = N(V.wican_temp_min), tMax = N(V.wican_temp_max);
const cMin = N(V.wican_cell_min), cMax = N(V.wican_cell_max);
const v12 = N(V.wican_12v), cur = N(V.wican_courant);
const lu = states[V.wican_soc]?.last_updated;
const age = lu ? Math.round((Date.now() - new Date(lu).getTime()) / 60000) : null;
const hv = v12 !== null && v12 > 13.3;
let H = '<div style="color:#e8eaed;font-size:13px;line-height:1.35;width:100%">';
H += hd('mdi:car-wrench', C.bl, T.title, 'WiCAN OBD · ' + (age === null ? T.nodata : T.upd(age)), badge(hv ? T.hvOn : T.hvOff, 'mdi:flash', hv ? C.g : C.mu));
H += grid(3, [
tile('mdi:current-dc', T.cur, fr(cur, 1) + ' A', C.bl),
tile('mdi:thermometer-low', T.tmin, fr(tMin, 0) + ' °C', C.bl),
tile('mdi:thermometer-high', T.tmax, fr(tMax, 0) + ' °C', C.or),
tile('mdi:sine-wave', T.cmin, fr(cMin, 3) + ' V', C.g),
tile('mdi:sine-wave', T.cmax, fr(cMax, 3) + ' V', C.g),
tile('mdi:car-battery', '12 V', fr(v12, 1) + ' V', C.yl, v12 !== null && v12 < 12.2 ? C.rd : null)
]);
H += grid(1, [tile('mdi:delta', T.spread, (cMin !== null && cMax !== null) ? fr((cMax - cMin) * 1000, 0) + ' mV' : '—', C.vi)]);
H += '<div style="display:flex;gap:6px;margin-top:10px;font-size:11px;color:#6b727c;line-height:1.5">' + IC('mdi:information-outline', 14) + '<span>' + T.note + '</span></div>';
return H + '</div>';
]]]Les variables
| Variable | Rôle |
|---|---|
| nom | Nom affiché en haut de la carte. |
| image | Photo de la voiture. Par défaut, celle de ce site. Pour ne pas dépendre du site, enregistrez-la dans config/www et indiquez /local/xpeng-g6.webp ; '' n'affiche aucune image. |
| capacite_kwh | Capacité de la batterie, pour estimer les kWh manquants quand XPENG Direct ne répond plus (80,8 sur les G6 2026). |
| pression_min, pression_max | Plage de pression des pneus jugée normale, en bar. Hors plage, le pneu passe en orange. |
| app | Début du nom de vos entités XPENG Direct, avant _soc (ex. xpeng_vehicle_0000). |
| wican_soc | Niveau de batterie lu par le WiCAN, utilisé quand XPENG Direct n'a rien envoyé depuis 30 minutes. |
| wican_temp_min, wican_temp_max | Températures de la batterie haute tension. |
| wican_cell_min, wican_cell_max | Tensions de cellules la plus basse et la plus haute (diagnostic). |
| wican_12v, wican_courant | Tension de la batterie 12 V et courant haute tension (diagnostic). |
| wican_odometre | Odomètre précis du WiCAN ; à défaut, celui de XPENG Direct. |

La photo du G6 est hébergée sur ce site : télécharger l'image. Pour une autre voiture ou une autre couleur, remplacez simplement la variable image.
Sur mon propre tableau de bord, la carte affiche aussi la part de solaire de chaque recharge et le bilan de l'année : ces chiffres viennent de ma borne, de mes batteries et de mes tarifs, donc ils ne sont pas dans ce code.
Pour aller plus loin
- Le tutoriel Xpeng : WiCAN Pro et XPENG Direct
- Tous les tutoriels Home Assistant
- La même carte pour n'importe quelle marque
Votre voiture remonte dans Home Assistant d'une autre façon ? Partagez votre méthode : les prochains tutoriels suivront les retours.
Combien vous coûte vraiment une recharge ? Heures creuses, Tempo, solaire, bornes rapides et codes XCombo : Watt Budget calcule tout, gratuitement et sans compte.
Ouvrir Watt Budget