Charjs 2 с реагированием

Я абсолютно новичок в реагирующей библиотеке. Я нашел эту библиотеку очень интересной и хочу реализовать ее в своем проекте анализа диаграмм (это весенний проект на основе Java). В основном я хочу реализовать это обычным способом, не хочу устанавливать npm или какой-либо менеджер пакетов. У меня есть два файла:

Файл: index.html

    <!DOCTYPE html>
    <html>
    <head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.1/react-dom.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.25.0/babel.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react-bootstrap/0.31.0/react-bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react-chartjs-2/2.1.0/react-chartjs-2.min.js"></script>
    <script type="text/babel" src="chart.js"></script>
    </head>
    <body>  
        <div id="root"></div>   
    </body>
</html>

Файл: chart.js

var MyComponent = React.createClass({
    render: function(){
      return <Line data={chartData} optionis={chartOptions} width="90%" height="70%" /> 
    }
});
ReactDOM.render(<MyComponent />, document.getElementById("root"));

Я думаю, это должно работать, но я получаю ошибку:Uncaught ReferenceError: Строка не определена

Примечание: я не хочу использовать менеджер npm. Таким образом, ответы с npm или javascript require или import не применимы к моему требованию.

Источник

2 ответа

Попробуйте эту реагирующую библиотеку https://github.com/reactjs/react-chartjs.
Вам просто нужно запустить npm install --save Reaction-chartjs в вашем проекте.
Затем просто импортируйте LineChart из eact-chartjs 

 var LineChart = require("react-chartjs").Line;
    var MyComponent = React.createClass({
        render: function() {
      return <LineChart data={chartData} optionis={chartOptions} width="90%" height="70%" /> 
        }
    });
    ReactDOM.render(<MyComponent />, document.getElementById("root"));
Источник

Вы ДОЛЖНЫ импортировать библиотеку chartJS (или в ES5 ее var Line = require('Line')).

Вот почему консоль сказала, что Линия не определена.

Источник
Другие вопросы по тегам