我在div元素中有一个图表,如下所示,它周围有白色。我该如何去除那里的白色?inspected elementchart
我试过了所有的答案:https://stackoverflow.com/questions/41546993/chartjs-is-there-any-way-to-remove-blank-space-around-pie-charts#:~:text= According%20to%20the%20docs%20here,Hope%20this%20helps%20someone!但它们似乎都不能与最新版本的chartjs一起工作(我在4. 2. 1上)。
图表代码:
import { Chart } from "chart.js/auto"
import { curvePlugin, textPlugin } from "./plugins"
type ChartGauge = typeof Chart
export interface Props {
// may add more prop vals later
value: number
}
export const addChart = (node: HTMLElement, params: Props): ChartGauge => {
const text = textPlugin(params)
const curve = curvePlugin()
return new Chart(node, {
type: "doughnut",
data: {
datasets: [
{
//label: params.caption,
data: [params.value, 100 - params.value],
backgroundColor: ["#056DFF", "#D9D9D9"],
borderColor: ["rgba(255, 255, 255 ,1)"],
borderWidth: 0,
},
],
},
options: {
rotation: -90,
cutout: "85%",
circumference: 180,
radius: "50%",
responsive: false
},
plugins: [text, curve],
})
}
显示代码:
<div>
<canvas
id="chart"
use:addChart={{value}}
>
</canvas>
</div>
1条答案
按热度按时间yptwkmov1#
将半径设置为更大的值REPL