Получить данные обратно из диаграммы, представленной в chart.js - PullRequest
0 голосов
/ 01 февраля 2019

У меня есть диаграмма.Это оказывает.Работает отлично!Диаграмма представляет собой сводку большой группы задач, которую я хотел бы отобразить ниже содержимого диаграммы, чтобы каждая задача была рассмотрена более подробно.Однако я хочу, чтобы эти задачи отражали данные, содержащиеся в диаграмме.IE.Если пользователь скрывает задачи, которые находятся в «назначенном» состоянии, я не хочу отображать какие-либо задачи, которые находятся в «назначенном» состоянии, в гораздо более подробном списке всех задач.Если пользователь скрывает все данные из своей диаграммы, я не хочу показывать какие-либо задачи вообще в подробном отчете.Если пользователь нажимает на диаграмму, чтобы отобразить задачи, которые находятся только в статусе «неназначенный», я хочу показать только задачи, которые не назначены под диаграммой.

Это создает 2 проблемы, которые я не смогрешить.

  1. Как вызвать перерисовку таблицы задач при обновлении диаграммы?

  2. Как получить скрытое ине скрытые элементы диаграммы, чтобы знать, что на самом деле нужно перерисовать?

<script src='https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.min.js'> 
</script>
<script !src="">
  var config = {
    type: 'doughnut',
    data: {
        datasets: [{
            data: [
                TASK_COUNTS['Failed'],
                TASK_COUNTS['Assigned'],
                TASK_COUNTS['Done'],
                TASK_COUNTS['Unassigned']
            ],
            backgroundColor: [
                'red',
                'yellow',
                'green',
                'gray'
            ],
            label: 'Task'
        }],
        labels: [
            'Failed',
            'Assigned',
            'Done',
            'Unassigned'
        ]
    },
    options: {
        legend: {
            position: 'top',
        },
        title: {
            display: true,
            text: 'Tasks'
        },
        animation: {
            animateScale: true,
            animateRotate: true
        }
    }
  };
  var ctx = document.getElementById('Tasks').getContext('2d');
  var chart = new Chart(ctx, config);
</script>`

Конечно, после этого я бы нарисовал сетку деталей задач.Позволяет вызвать эту функцию.DrawTasks ().

...