javascript 在react apexchart中显示波斯/贾拉拉利日期

zpqajqem  于 2023-02-28  发布在  Java
关注(0)|答案(2)|浏览(139)

你能指导我如何做一个“日期时间X轴”图表与react Apexchart.js当我的日期是在波斯语?最后,我应该做一个“brushChart”与日期时间X轴,如果你有一个类似的项目,可以帮助我请发送他们的链接
我有这些代码如下,我尝试了“defaultLocale”和“name”与“Per”和“Fa”,但没有一个工作,并得到一个错误和应用程序崩溃。

chart: {
  id: 'reactchart-example',
  defaultLocale: 'Fa',
  locales: [
    {
      name: 'per',
      options: {
        months: [
          'دی',
          'بهمن',
          'اسفند',
          'فروردین',
          'اردیبهشت',
          'خرداد',
          'تیر',
          'مرداد',
          'شهریور',
          'مهر',
          'آبان',
          'آذر',
        ],
        shortMonths: ['دی', 'بهم', 'اسف', 'فرو', 'ارد', 'خرد', 'تیر', 'مرد', 'شهر', 'مهر', 'آبا', 'آذر'],
        days: ['یکشنبه', 'دوشنبه', 'سه شنبه', 'چهارشنبه', 'پنج شنبه', 'جمعه', 'شنبه'],
        shortDays: ['یک', 'دو', 'سه', 'چهار', 'پنج', 'جمع', 'شنب'],
        toolbar: {
          download: 'دانلود SVG',
          selection: 'انتخاب',
          selectionZoom: 'انتخاب بزرگنمایی',
          zoomIn: 'بزرگنمایی',
          zoomOut: 'کوچک نمایی',
          pan: 'جابجایی',
          reset: 'بازگرداندن',
        },
      },
    },
  ],
},

谢谢你的帮助

bq3bfh9z

bq3bfh9z1#

你不需要在你的图表对象中添加整个配置,在你的node_modules文件夹中,每个locale都有一个json文件:“apexcharts/分布/区域设置/”
所有你需要的是导入你想要的locale json文件到你的代码中,如下所示

import fa from "apexcharts/dist/locales/fa.json"

然后简单地在对象“chart”中设置**“locales”数组和“defaultLocale”**,如下所示:

chart: {
  //The following two lines are the key answer
  locales: [fa], //or multi language like [fa, en]
  defaultLocale: 'fa',
  
  //your other configs ...
},
alen0pnh

alen0pnh2#

如果不使用任何前端框架,也可以简单地在<script></script>标签中使用fa.json内容,例如:

<script>
var farsi_local = {
          "name": "fa",
          "options": {
            "months": [
              "فروردین",
              "اردیبهشت",
              "خرداد",
              "تیر",
              "مرداد",
              "شهریور",
              "مهر",
              "آبان",
              "آذر",
              "دی",
              "بهمن",
              "اسفند"
            ],
            "shortMonths": [
              "فرو",
              "ارد",
              "خرد",
              "تیر",
              "مرد",
              "شهر",
              "مهر",
              "آبا",
              "آذر",
              "دی",
              "بهمـ",
              "اسفـ"
            ],
            "days": [
              "یکشنبه",
              "دوشنبه",
              "سه شنبه",
              "چهارشنبه",
              "پنجشنبه",
              "جمعه",
              "شنبه"
            ],
            "shortDays": ["ی", "د", "س", "چ", "پ", "ج", "ش"],
            "toolbar": {
              "exportToSVG": "دانلود SVG",
              "exportToPNG": "دانلود PNG",
              "exportToCSV": "دانلود CSV",
              "menu": "منو",
              "selection": "انتخاب",
              "selectionZoom": "بزرگنمایی انتخابی",
              "zoomIn": "بزرگنمایی",
              "zoomOut": "کوچکنمایی",
              "pan": "پیمایش",
              "reset": "بازنشانی بزرگنمایی"
            }
          }
        };
</script>

然后在图表中使用它:

chart: {
      locales: [farsi_local],
      defaultLocale: 'fa',
.
.
.

相关问题