vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Chart stackblitz demo updates

pull/4649/head
Tuğçe Küçükoğlu 2023-10-17 17:07:23 +03:00
parent ff35703343
commit 44081515b4
4 changed files with 73 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
doc/chart/DoughnutDoc.vue
View File

@ -39,6 +39,7 @@ export default {
},
mounted() {
this.chartData = this.setChartData();
this.chartOptions = this.setChartOptions();
},
methods: {
setChartData() {
@ -54,6 +55,21 @@ export default {
}
]
};
},
setChartOptions() {
const documentStyle = getComputedStyle(document.documentElement);
const textColor = documentStyle.getPropertyValue('--text-color');
return {
plugins: {
legend: {
labels: {
cutout: '60%',
color: textColor
}
}
}
};
}
}
};
@ -71,12 +87,11 @@ import { ref, onMounted } from "vue";
onMounted(() => {
chartData.value = setChartData();
chartOptions.value = setChartOptions();
});
const chartData = ref();
const chartOptions = ref({
cutout: '60%'
});
const chartOptions = ref(null);
const setChartData = () => {
const documentStyle = getComputedStyle(document.body);
@ -92,6 +107,22 @@ const setChartData = () => {
]
};
};
const setChartOptions = () => {
const documentStyle = getComputedStyle(document.documentElement);
const textColor = documentStyle.getPropertyValue('--text-color');
return {
plugins: {
legend: {
labels: {
cutout: '60%',
color: textColor
}
}
}
};
};
<\/script>
`
}

4
doc/chart/HorizontalBarDoc.vue
View File

@ -74,7 +74,7 @@ export default {
plugins: {
legend: {
labels: {
fontColor: textColor
color: textColor
}
}
},
@ -159,7 +159,7 @@ const setChartOptions = () => {
plugins: {
legend: {
labels: {
fontColor: textColor
color: textColor
}
}
},

53
doc/chart/PieChartDoc.vue
View File

@ -32,19 +32,12 @@ export default {
data() {
return {
chartData: null,
chartOptions: {
plugins: {
legend: {
labels: {
usePointStyle: true
}
}
}
}
chartOptions: null
};
},
mounted() {
this.chartData = this.setChartData();
this.chartOptions = this.setChartOptions();
},
methods: {
setChartData() {
@ -60,6 +53,21 @@ export default {
}
]
};
},
setChartOptions() {
const documentStyle = getComputedStyle(document.documentElement);
const textColor = documentStyle.getPropertyValue('--text-color');
return {
plugins: {
legend: {
labels: {
usePointStyle: true,
color: textColor
}
}
}
};
}
}
};
@ -77,18 +85,11 @@ import { ref, onMounted } from "vue";
onMounted(() => {
chartData.value = setChartData();
chartOptions.value = setChartOptions();
});
const chartData = ref();
const chartOptions = ref({
plugins: {
legend: {
labels: {
usePointStyle: true
}
}
}
});
const chartOptions = ref();
const setChartData = () => {
const documentStyle = getComputedStyle(document.body);
@ -104,6 +105,22 @@ const setChartData = () => {
]
};
};
const setChartOptions = () => {
const documentStyle = getComputedStyle(document.documentElement);
const textColor = documentStyle.getPropertyValue('--text-color');
return {
plugins: {
legend: {
labels: {
usePointStyle: true,
color: textColor
}
}
}
};
};
<\/script>
`
}

4
doc/chart/VerticalBarDoc.vue
View File

@ -73,7 +73,7 @@ export default {
plugins: {
legend: {
labels: {
fontColor: textColor
color: textColor
}
}
},
@ -157,7 +157,7 @@ const setChartOptions = () => {
plugins: {
legend: {
labels: {
fontColor: textColor
color: textColor
}
}
},