Можно ли использовать Chart.js в web2py? - PullRequest
Новая
       5

Можно ли использовать Chart.js в web2py?

0 голосов
/ 14 февраля 2019

Я борюсь с приложением в web2py.Мне нужно включить элемент диаграммы (радиолокационная карта), и я пробовал много вариантов, но безуспешно.Затем я решил использовать Chart.bundle.js, добавив скрипт в представление и сохранив файл Chart.bundle.js в статическом каталоге.

Но он не работает.Я не получаю никакой ошибки, но диаграмма не загружается в представлении.Ниже приведен код вида: 

{{extend 'layout.html'}}

<html>
<head>

<script src='static/Chart.bundle.js'></script>

</head>

<body>

<br>

<div id="wrapper">
  <canvas id="chartjs-radar" width="600" height="400"></canvas>
</div>

<script type="text/javascript">
        var presets = window.chartColors;
        var utils = Samples.utils;

        var data = {
            labels: {{=areaslist}},
            datasets: [{
                backgroundColor: utils.transparentize(presets.red),
                borderColor: presets.red,
                data: {{=calcperarea}},
                label: 'Digital Maturity Assessment'
            }]
        };

        var options = {
            maintainAspectRatio: true,
            spanGaps: false,
            elements: {
                line: {
                    tension: 0.000001
                }
            }
        };

        var chart = new Chart('chartjs-radar', {
            type: 'radar',
            data: data,
            options: options
        });

</script>

</body>

</html>

Спасибо.

Ответы [ 2 ]

0 голосов
/ 14 февраля 2019 
<script src='static/Chart.bundle.js'></script>

Проверьте вкладку сети инструментов разработчика браузера, чтобы увидеть, загружается ли Chart.bundle.js.Скорее всего, вы получите ответ 404, так как вышеупомянутый URL является относительным URL и будет добавлен к URL родительской страницы.Вместо этого вам следует использовать помощник web2py URL для генерации всех внутренних URL-адресов: 

<script src="{{=URL('static', 'Chart.bundle.js')}}"></script>

Приведенное выше должно генерировать URL-адрес, подобный /appname/static/Chart.bundle.js (appname будет исключено, если для маршрутизации по умолчанию настроено значениеэто приложение).

0 голосов
/ 14 февраля 2019

Вы пытаетесь создать его неправильно, вы не можете просто указать идентификатор диаграммы и использовать его.Вам нужно ctx, контекст вашего элемента canvas.Посмотрите, как вы можете использовать его: 

$("#chartjs-radar").get(0).getContext('2d');

или 

document.getElementById('chartjs-radar').getContext('2d');

Используйте это вместо идентификатора при создании диаграммы.(Тогда вы можете использовать только chart.js, а не связку)

...