Search results

Internationalization

Circular gauge provide supports for internationalization for below gauge elements.

  • Axis label.
  • Tooltip.

For more information about number formatter you can refer internationalization.

Globalization

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.

Numeric Format

In the below example axis labels are globalized to EUR.

Source
Preview
app.vue
<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>