Как реализовать тип свечи в модуле Anychart-React npm для проекта React

Я пытаюсь внедрить в свой проект React модуль реакции AnyChart с японским типом диаграммы,

это мой компонент:

class Graph extends Component {
    render() {
        return (
            <div className = "Graph">
                <center>
                    <AnyChart
                        width = {960}
                        height = {500}
                        type = "candlestick"
                        data = {[
                              ["2007-07-23", 23.55, 23.88, 23.38, 23.62],
                              ["2007-07-24", 22.65, 23.7, 22.65, 23.36],
                              ["2007-07-25", 22.75, 23.7, 22.69, 23.44],
                              ["2007-07-26", 23.2, 23.39, 22.87, 22.92],
                              ["2007-07-27", 23.98, 24.49, 23.47, 23.49],
                              ["2007-07-30", 23.55, 23.88, 23.38, 23.62],
                              ["2007-07-31", 23.88, 23.93, 23.24, 23.25],
                              ["2007-08-01", 23.17, 23.4, 22.85, 23.25],
                              ["2007-08-02", 22.65, 23.7, 22.65, 23.36],
                              ["2007-08-03", 23.2, 23.39, 22.87, 22.92],
                              ["2007-08-06", 23.03, 23.15, 22.44, 22.97],
                              ["2007-08-07", 22.75, 23.7, 22.69, 23.44]
                        ]}
                        legend = "true"
                        title = "Simple Data"
                    />
                </center>
            </div>
        )
    }
}

и он возвращается

TypeError: anychart[e.type] is not a function
...

с большой ошибкой после

это источник, вероятно, у него есть не все параметры, но я не знаю, как реализовать его в теге jsx, например, атрибуты

(https://www.npmjs.com/package/anychart-react)
(https://docs.anychart.com/Basic_Charts/Japanese_Candlestick_Chart)
(https://docs.anychart.com/7.12.0/Basic_Charts_Types/Japanese_Candlestick_Chart)

reactjs anychart

01.06.2018 19:01

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Навигация по приложениям React: Исчерпывающее руководство по React Router

React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...

Массив зависимостей в React

Все о массиве Dependency и его связи с useEffect.

Компонент против элемента в ReactJS - секрет оптимизации производительности за счет повторного использования элементов

Проще говоря, компонент - это фабрика для создания элементов.

Руководство по использованию хука useEffect для методов жизненного цикла React

300

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я бы предложил вам другой подход к созданию биржевой диаграммы. Вы можете определить экземпляр диаграммы. Ниже вы можете найти JS и HTML код примера биржевой диаграммы.

var msftDataTable = anychart.data.table();
msftDataTable.addData(window.get_msft_daily_short_data());
var chart = anychart.stock();
var firstPlot = chart.plot(0);
firstPlot.area(msftDataTable.mapAs({'value': 4})).name('MSFT');

ReactDOM.render(
  <AnyChart
    width = {800}
    height = {800}
    instance = {chart}
    title = "Stock demo"
  />, document.getElementById('root'));

HTML

<body>
<div id = "root" style = "width: 800px; height: 800px"></div>
<script src = "stock.min.js"></script>
</body>

Где stock.min.js - это скомпилированный код JS.

04.06.2018 07:53

Другие вопросы по теме

Как объединить Anychart Stockchart с неэквидистантными точками данных?

AnyChart не отображает индикатор выполнения

AnyChart - Прямая трансляция биржевой диаграммы

AnyChart - Заполнение биржевой диаграммы с отсутствующими точками данных

AnyChart Firebase

Как реализовать праздничные дни и рабочие дни в AnyChart Gantt Resource

Как распечатать все задачи в AnyGantt

Можно ли иметь горизонтальную полосу прокрутки в таблицах AnyChart?

Как определить, в какой период я нахожусь в режиме редактирования в ganttResource anychart 8.2.0

Как изменить некоторые данные в таблице?

Как реализовать тип свечи в модуле Anychart-React npm для проекта React

Ответы 1

Другие вопросы по теме

Похожие вопросы