mirror of
https://github.com/twinpath/app.git
synced 2026-01-27 05:42:04 +07:00
62 lines
1.8 KiB
JavaScript
62 lines
1.8 KiB
JavaScript
|
|
export const initChartTwo = () => {
|
|
const chartElement = document.querySelector('#chartTwo');
|
|
|
|
if (chartElement) {
|
|
const chartTwoOptions = {
|
|
series: [75.55],
|
|
colors: ["#465FFF"],
|
|
chart: {
|
|
fontFamily: "Outfit, sans-serif",
|
|
type: "radialBar",
|
|
height: 330,
|
|
sparkline: {
|
|
enabled: true,
|
|
},
|
|
},
|
|
plotOptions: {
|
|
radialBar: {
|
|
startAngle: -90,
|
|
endAngle: 90,
|
|
hollow: {
|
|
size: "80%",
|
|
},
|
|
track: {
|
|
background: "#E4E7EC",
|
|
strokeWidth: "100%",
|
|
margin: 5, // margin is in pixels
|
|
},
|
|
dataLabels: {
|
|
name: {
|
|
show: false,
|
|
},
|
|
value: {
|
|
fontSize: "36px",
|
|
fontWeight: "600",
|
|
offsetY: 60,
|
|
color: "#1D2939",
|
|
formatter: function (val) {
|
|
return val + "%";
|
|
},
|
|
},
|
|
},
|
|
},
|
|
},
|
|
fill: {
|
|
type: "solid",
|
|
colors: ["#465FFF"],
|
|
},
|
|
stroke: {
|
|
lineCap: "round",
|
|
},
|
|
labels: ["Progress"],
|
|
};
|
|
|
|
const chart = new ApexCharts(chartElement, chartTwoOptions);
|
|
chart.render();
|
|
return chart;
|
|
}
|
|
}
|
|
|
|
export default initChartTwo;
|