Как создать новую круговую диаграмму, используя высокие графики в Angular 5 - PullRequest
Новая
       11

Как создать новую круговую диаграмму, используя высокие графики в Angular 5

0 голосов
/ 15 мая 2018

Я работаю над приложением Angular 5, где меня просят использовать высокие графики и отображать некоторую информацию на круговых диаграммах и гистограммах.Данные, которые я получаю от вызова веб-API, представлены в формате json и выглядят следующим образом: 

[
  {
    "fruit": "Orange",
    count: 10
  },
  {
    "fruit": "Strawberry",
    count: 20
  }
]

Ниже приведен пример кода моей круговой диаграммы: 

this.chart = new Chart({
     chart: {
       type: 'pie'
     },
     title: {
       text: 'Available Fruits'
     },
     credits: {
       enabled: false
     },
     series : [{
       name: 'Line 1',
       data: [10, 20, 30, 40]
     }]
   });

Итак, эти данныеявляется динамическим, и я хочу передать эти данные в качестве входных данных для круговой диаграммы. Я также хочу, чтобы аналогичные данные отображались в виде гистограммы.Графики должны отображаться после того, как вызовы веб-API вернут мне эти данные.Не могли бы вы сообщить мне, как я мог бы реализовать эту функцию.

Примечание: значение данных в объекте диаграммы является только временным значением, и мне нужно, чтобы это значение было данными json, возвращаемыми из веб-API.

...