Circular gauge provide supports for internationalization for below gauge elements.
For more information about number formatter you can refer
internationalization.
Globalization is the process of designing and developing a component that works in different cultures/locales.
Internationalization library is used to globalize number in CircularGauge component
using format property in labelStyle.
In the below example axis labels are globalized to EUR.
<template>
<div id="app">
<div class='wrapper'>
<ejs-circulargauge :axes='axes' >
</ejs-circulargauge>
</div>
</div>
</template>
<script>
import Vue from 'vue';
import { CircularGaugePlugin } from "@syncfusion/ej2-vue-circulargauge";
import { loadCldr, L10n, setCulture, setCurrencyCode } from '@syncfusion/ej2-base';
setCulture('de');
setCurrencyCode('EUR');
Vue.use(CircularGaugePlugin);
export default {
data: function () {
return {
axes: [{
labelStyle: {
position: 'Inside',
format: 'c'
}
}]
}
}
};
</script>
<style>
@import "../../node_modules/@syncfusion/ej2-vue-circulargauge/styles/material.css";
.wrapper {
max-width: 300px;
margin: 0 auto;
}
</style>