0
192
Vistasreaccionar: anula el estilo del lienzo
Esta es la interfaz de usuario actual
Quiero eliminar el background-color de los números (1-10), que es #fff .
¿Es posible hacerlo?
Aplicación.tsx
import React from "react"; import { Chart as ChartJS, RadialLinearScale, ArcElement, Tooltip, Legend } from "chart.js"; import { PolarArea } from "react-chartjs-2"; ChartJS.register(RadialLinearScale, ArcElement, Tooltip, Legend); export const data = { labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"], datasets: [ { label: "# of Votes", data: [1, 1, 1, 10, 1, 1], backgroundColor: [ "rgba(255, 99, 132, 0.5)", "rgba(54, 162, 235, 0.5)", "rgba(255, 206, 86, 0.5)", "rgba(75, 192, 192, 0.5)", "rgba(153, 102, 255, 0.5)", "rgba(255, 159, 64, 0.5)" ], borderWidth: 1 } ] }; export function App() { return <PolarArea data={data} />; } codigosandbox
https://codesandbox.io/s/autumn-sun-ty6egy?file=/App.tsx
1 Respuestas
Responde la pregunta0
Si tu única pregunta es:
Quiero eliminar el color de fondo... ¿Es posible hacerlo?
La respuesta es SÍ. sin duda eso es posible!
... pero ¿estás seguro de que hay un color de fondo en los números?
me parece transparente...
Pero dado que ese gráfico no es su código, tendrá que confiar en lo que tienen:
https://react-chartjs-2.js.org/components/polar-area
O si tiene las habilidades, modifique el código fuente de ese paquete que está usando:
https://github.com/reactchartjs/react-chartjs-2
Aquí hay un círculo con un número, sin fondo:
var c = document.getElementById('canvas').getContext("2d"); c.fillText("88", 45, 15) c.arc(50, 50, 40, Math.PI * 3/2 + 0.2, Math.PI * 3/2 - 0.2) c.stroke() <canvas id="canvas"></canvas>