Как создать диаграмму радара / диаграмму паука с ploylt.js

Я только начал использовать plotly.js с react.
Прямо сейчас я хочу сделать радиолокационную карту с 18 угловыми координатами, но так как нет радиолокационной карты в plotly.js, я не уверен, что это лучший способ сделать это.

Я нашел два способа сделать, но не идеально.

  1. Первый способ, который я нашел, — использовать полярную диаграмму для создания диаграммы радара, но есть некоторые проблемы. Введите описание изображения здесьЯ устанавливаю радикальные координаты (r) и угловые координаты (t), как это r: [60, 72.5, 70.0, 45.0, 60.5], t: ["math", "history", "music", "english", "geography"]для левой диаграммы на рисунке; однако, поскольку угловые координаты являются строками, я не могу связать первую координату и последнюю координату с линией, как вы можете видеть на рисунке.

Следующая проблема заключается в том, что если у меня больше 6 координат, диаграмма не показывает все угловые координаты. В правой диаграмме на картинке я задаю такие координатыr: [60, 72.5, 70.0, 45.0, 60.5, 60, 30, 20, 10], t: ["math", "history", "music", "english", "geography", "logic", "ethic", "aaaa", "bbbb"], и она показывает только 5 из 9 угловых координат, в то время как я хочу, чтобы она показывала каждую координату.

  1. Второй способ-создать такую диаграмму, но я чувствую, что это не эффективный способ сделать это. Так как похоже, что я должен записать каждую деталь диаграммы, было бы не гибко адаптировать различные данные.

Это вещи, которые я нашел до сих пор, но я чувствую, что я упускаю более простой способ сделать диаграмму радара в plotly.js. Не может быть настолько сложно и неэффективно создавать радиолокационную карту.

Я знаю, что есть и другие библиотеки, такие как chart.js, которые поддерживают диаграмму радара, но мне нужно сделать это в plotl.js

Что является лучшим способом создания диаграммы радара в plotly.js?

1 ответ