highchartr: синхронизировать цвета точек и линий и легенды - PullRequest
Новая
       61

highchartr: синхронизировать цвета точек и линий и легенды

0 голосов
/ 19 апреля 2020

Я использую пакет highchartr для создания интерактивной диаграммы.

На моем графике есть линии, соответствующие разным сериям. Кроме того, я хотел бы иметь фигуры в определенных точках линий.

Очень легко получить очки в нужном месте. Однако я хотел бы отобразить цвет точки на линию, с которой он связан. И когда пользователь нажимает на запись легенды для линии, я бы хотел, чтобы связанные точки также переключались.

Код выглядит следующим образом: 

 highchart() %>%
    hc_add_series(
      type="line",
      marker=list(enabled=F),
      data=input_data, 
      mapping=hcaes(x=x, y=y, group=series_name)
    ) %>%
    hc_add_series(
      type="point", 
      data=input_data %>% filter(! is.na(marker)), 
      mapping=hcaes(x=x, y=y, color=series_name, fill=series_name, group=series_name, shape=marker)
    )

Результат получен точки в нужном месте. Но цвет точки зависит от цветового соответствия линий. Нажатие на запись для строки в легенде переключает только линию - точки отображаются как отдельные записи на series_name.

enter image description here

Что

Что можно сделать так: - Точки и линии имеют одинаковое цветовое отображение - Точки и линии могут быть вместе, нажав на линию в легенде. - Точки отображаются в легенде отдельно, в зависимости от их формы, а не от цвета?

Спасибо!

1 Ответ

0 голосов
/ 24 апреля 2020

Как правило, это может быть достигнуто по крайней мере несколькими различными способами. Все зависит от ваших данных, которые вы не предоставили (я создал пример данных).

Кроме того, я приведу все примеры в jsFiddle (JavaScript), потому что быстрее объяснить что-либо таким образом с быстрым онлайн примером. Окончательный ответ будет содержать код R (возможно, с некоторым пользовательским JavaScript, если необходимо, но все будет воспроизводимо в R.

Прежде всего, ваше предположение, что вам нужно отдельная серия является неправильной и вызывает проблемы.Если вы хотите, чтобы маркеры на вашей линии были одинакового цвета, и вы хотите соединить их вместе по щелчку легенды, то вам не нужны отдельные серии - одна серия с включенными маркерами на некоторых очков достаточно , см. этот пример: https://jsfiddle.net/BlackLabel/s24rk9x7/ В этом случае данные R должны быть определены правильно.

Если вы не хотите сохранять это просто, как описано выше, вы можете хранить линии и маркеры как отдельные серии, как в исходном вопросе. В этом случае вы можете использовать свойство series.linkedTo , чтобы соединить ваши "точечные" серии с сериями линий (BTW в Highcharts нет чего-то вроде типа «точка» серии, это «разброс» * типа серии 1021 *. Еще одна причина, по которой ваш код неправильный и не работает, и вы получили unv ), но есть проблема с ним в Highcharter - не работает, похоже на ошибку и о ней следует сообщать в репозитории Highcharter GitHub.

Это версия JavaScript, которая отлично работает: https://jsfiddle.net/BlackLabel/3mtdfqLo/ В этом примере, если вы хотите сохранить маркеры и ряды линий в одном цвете, вы можете определить цвета вручную или написать собственный код (как я), который автоматически изменит цвет для вас. .

И это та же версия R, которая должна работать, но это не так: 

library(highcharter)

highchart() %>%
  hc_add_series(
    data=list(4, 3, 5, 6, 2, 3)
  ) %>%
  hc_add_series(
    data=list(14, 13, 15, 16, 12, 13),
    id="first"
  ) %>%
  hc_add_series(
    data=list(10, 8, 6, 2, 5, 12),
    id="second"
  ) %>%
  hc_add_series(
    type="scatter",
    linkedTo="first",
    data=list(list(1, 3), list(2, 5))
  ) %>%
  hc_add_series(
    type="scatter",
    linkedTo="second",
    data=list(list(1, 13), list(2, 15), list(3, 16))
  ) %>%
  hc_plotOptions(
    line = list(marker=list(enabled=F))
  )

Возможно, что-то не так с функцией hc_add_series. В качестве обходного пути , вы можете написать все это как собственный JavaScript код, который (опять же) работает нормально: 

library(highcharter)

highchart() %>%
  hc_plotOptions(
    line = list(marker=list(enabled=F))
  ) %>%
  hc_chart(
    events = list(load = JS("function() {

        this.addSeries({
          data: [4, 3, 5, 6, 2, 3],
          id: 'first'
        });

        this.addSeries({
          data: [14, 13, 15, 16, 12, 13],
          id: 'second'
        });

        this.addSeries({
          data: [10, 8, 6, 2, 5, 12]
        });

        this.addSeries({
          type: 'scatter',
          linkedTo: 'first',
          data: [[1, 3], [2, 5]]
        });

        this.addSeries({
          type: 'scatter',
          linkedTo: 'second',
          data: [[1, 13], [2, 15], [3, 16]]
        });

    }")))

Конечно, последние примеры не содержат функциональности, которая меняет цвет - вы можете скопировать его из jsFiddle выше.

...