Передайте пользовательский объект даты из библиотеки jalali-moment в параметр time.Date

Я использую библиотеку jalali-moment в своем проекте для работы с персидскими датами. в настоящее время я застрял в том, как использовать библиотеку с высокими диаграммами для преобразования всех дат в даты Джалали. Я нашел параметр "time.Date", который использует пользовательский объект Date для выполнения всех операции, связанные с датой, такие как кнопки масштабирования на диаграмме хайстока и метки xAxis на диаграмме хайстока и линейной диаграмме. Но действительно я не понимаю, как создать и передать ему пользовательский объект? Я вижу все связанные вопросы и ответы в StackOverflow, но ни один из них не использовал возможность изменить объект даты, также никто не упоминает, как это сделать с библиотекой jalali-moment. Даже в документации highcharts нет официального примера. обратите внимание, что я должен использовать библиотеку jalali-moment и не могу использовать никакую другую.

Не могли бы вы объяснить, как именно этого добиться? (Лучше упомянуть, что я использую библиотеку highcharts в среде reactjs.)


person Saeed Zhiany    schedule 20.05.2019    source источник


Ответы (1)


Вы можете перезаписать все методы Highcharts.dateFormats и использовать в них плагин jalali-moment:

moment.locale('fa');

Highcharts.dateFormats = {
  'a': function(ts) {
    return moment(ts).format('dddd')
  },
  'A': function(ts) {
    return moment(ts).format('dddd')
  },
  'd': function(ts) {
    return moment(ts).format('DD')
  },
  'e': function(ts) {
    return moment(ts).format('D')
  },
  'b': function(ts) {
    return moment(ts).format('MMMM')
  },
  'B': function(ts) {
    return moment(ts).format('MMMM')
  },
  'm': function(ts) {
    return moment(ts).format('MM')
  },
  'y': function(ts) {
    return moment(ts).format('YY')
  },
  'Y': function(ts) {
    return moment(ts).format('YYYY')
  },
  'W': function(ts) {
    return moment(ts).format('ww')
  }
};

Текущая демонстрация: http://jsfiddle.net/BlackLabel/cbqh3d0m/

Справочник по API: https://api.highcharts.com/class-reference/Highcharts#.dateFormats

Кроме того, вы можете проверить плагин Highcharts Localization в качестве альтернативного решения: https://www.highcharts.com/products/plugin-registry/single/21/Highcharts%20Localization

person ppotaczek    schedule 20.05.2019
comment
Перезапись Highchart.DateFormat заставляет кнопки масштабирования highstock автоматически работать в дате jalali? - person Saeed Zhiany; 20.05.2019
comment
Итак, каков вариант использования опции time:Date? вроде нигде не используется. - person Saeed Zhiany; 20.05.2019
comment
Также использование Highcharts.dateFormats дает мне ошибку машинописного текста. в нем говорится, что dateFormat является членом Highchart только для чтения. тем не менее, живая демонстрация работает, но я все еще не могу ее использовать - person Saeed Zhiany; 20.05.2019
comment
Привет @Saeed Zhiany, я не эксперт в этом вопросе, но Highcharts основан на временных метках и использует dateFormats только для отображения дат в определенном формате. Вы можете проверить, работают ли кнопки масштабирования так, как вам нужно: jsfiddle.net/BlackLabel/2cm5prxz - person ppotaczek; 20.05.2019
comment
Я обновил свой вопрос, чтобы сделать его более понятным из моего требования (мне не нужны только текущие даты в датах Джалали, я хочу, чтобы диаграмма работала с датами Джалали, как в кнопках увеличения масштаба). извините за предыдущую двусмысленность. - person Saeed Zhiany; 20.05.2019
comment
Параметр time должен быть совместим с исходным классом Date javascript. jdate - github.com/tahajahangir/jdate работает нормально: jsfiddle.net/BlackLabel/qygrkxv2 - person ppotaczek; 20.05.2019
comment
Как я упоминал ранее, я использовал вашу официальную реактивную оболочку highcharts. но когда я импортирую highcharts (import * as highcharts from 'highcharts') и пытаюсь инициировать dateFormats в конструкторе компонента, мне выдает ошибку, что свойство доступно только для чтения, и я не могу его инициировать. - person Saeed Zhiany; 20.05.2019
comment
ваша вторая живая демонстрация тоже работает. но я не мог использовать его в своих кодах. к сожалению, все хорошие примеры написаны на чистом javascript, а в reactJs+typescript нет примера исходного кода. Я действительно смущен тем, как заставить это работать. - person Saeed Zhiany; 20.05.2019
comment
Привет @Saeed Zhiany. Как видите, в этом случае очень сложно использовать вашу библиотеку. Вы можете попробовать полагаться на время в миллисекундах и преобразовать все текстовые элементы диаграммы (метки, всплывающую подсказку, селектор диапазона) в дату jalali, например: jsfiddle.net/BlackLabel/derbuav6. Вы также можете попытаться обернуть все методы dateFormats вместо их перезаписи: jsfiddle.net/BlackLabel/ts5hcdvu - person ppotaczek; 21.05.2019