Nova Energía
NOVA en la Bolsa de Madrid48,32 €+2,41 %
48,32 €+2,41 %
Une carte de cours dont la courbe se dessine, avec des onglets de période et un réticule qui suit le pointeur.
<article class="uv-kst"><header><span class="lg">NV</span><div><h3>Nova Énergie</h3><span class="tk">NOVA à la Bourse de Madrid</span></div></header><p class="pr"><b>48,32 €</b><span class="ch">+2,41 %</span></p><div class="gr"><svg viewBox="0 0 100 40" preserveAspectRatio="none" aria-hidden="true"><defs><linearGradient id="uv-kst-g" x1="0" x2="0" y1="0" y2="1"><stop offset="0" stop-color="currentColor" stop-opacity=".28"/><stop offset="1" stop-color="currentColor" stop-opacity="0"/></linearGradient></defs><polygon class="ar" points="0,40 0.0,36.0 3.7,31.9 7.4,33.2 11.1,35.2 14.8,32.7 18.5,31.9 22.2,32.9 25.9,30.2 29.6,27.5 33.3,26.6 37.0,24.5 40.7,22.8 44.4,19.6 48.1,21.3 51.9,21.9 55.6,19.6 59.3,17.4 63.0,20.7 66.7,18.6 70.4,18.4 74.1,14.2 77.8,11.1 81.5,13.8 85.2,13.2 88.9,9.1 92.6,6.9 96.3,5.2 100.0,4.0 100,40"/><polyline class="ln" pathLength="1" points="0.0,36.0 3.7,31.9 7.4,33.2 11.1,35.2 14.8,32.7 18.5,31.9 22.2,32.9 25.9,30.2 29.6,27.5 33.3,26.6 37.0,24.5 40.7,22.8 44.4,19.6 48.1,21.3 51.9,21.9 55.6,19.6 59.3,17.4 63.0,20.7 66.7,18.6 70.4,18.4 74.1,14.2 77.8,11.1 81.5,13.8 85.2,13.2 88.9,9.1 92.6,6.9 96.3,5.2 100.0,4.0"/><line class="cx" x1="0" x2="0" y1="0" y2="40"/></svg><span class="tp">48,32 €</span></div><div class="pe" role="radiogroup" aria-label="Période"><label><input type="radio" name="uv-kst" value="0" checked><span>1D</span></label><label><input type="radio" name="uv-kst" value="1"><span>1S</span></label><label><input type="radio" name="uv-kst" value="2"><span>1M</span></label></div></article>Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.
Les tableaux de bord financiers et les applis d'investissement ont besoin de cartes compactes qui montrent cours, variation et tendance d'un coup. Celle-ci dessine sa courbe au chargement avec un dégradé doux dessous, passe du jour à la semaine et au mois avec de petits onglets et affiche un réticule pointillé avec le cours à cet endroit au survol.
Le graphique est un SVG adaptatif aux traits non déformés, net à toutes les largeurs. Remplace les séries d'exemple par tes propres points et utilise le vert ou le rouge selon la variation.