52 lines
942 B
Vue
52 lines
942 B
Vue
<template>
|
|
<div class="container">
|
|
<pie :chartdata="data" :options="options"></pie>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import pie from './charjs_donut'
|
|
|
|
export default {
|
|
name: 'postesComparison',
|
|
components: {
|
|
'pie': pie
|
|
},
|
|
data () {
|
|
return {
|
|
data: {
|
|
labels: ["Africa", "Asia", "Europe", "Latin America", "North America"],
|
|
datasets: [
|
|
{
|
|
label: "Population (millions)",
|
|
backgroundColor: ["#3e95cd", "#8e5ea2","#3cba9f","#e8c3b9","#c45850"],
|
|
data: [2478,5267,734,784,433]
|
|
}
|
|
]
|
|
},
|
|
options: {
|
|
responsive: true,
|
|
maintainAspectRatio: false,
|
|
title: {
|
|
display: true,
|
|
text: 'Predicted world population (millions) in 2050'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
computed: {
|
|
},
|
|
methods: {
|
|
}
|
|
}
|
|
|
|
</script>
|
|
|
|
<style scope>
|
|
.container {
|
|
position: relative;
|
|
height: 40vh;
|
|
width: 80vw;
|
|
}
|
|
</style>
|