Как избавиться от осевых линий в ChartJS? - PullRequest
0 голосов
/ 23 июня 2018

Я играю с ChartJS уже два дня, и мне кажется, что я не могу избавиться от светло-серых линий оси (обе вертикальные и горизонтальные).

Снимок экрана моего графика с указанием линий, которые я хотел бы удалить

Поскольку это проект Laravel, я работаю с пакетом ConsoleTV Charts. Код для диаграммы следующий:

$this->options([
      'legend' => [
        'display' => false
      ],
      'scales' => [
        'xAxes' => [
          'gridLines'=> [
            'drawOnChartArea' => 'false',
            'display' => 'false',
          ],
          'display' => 'false',
        ],
      ],
      'elements' => [
        'line' => [
          'backgroundColor' => 'rgba(71, 15, 244, 0.2)',
          'borderColor' => '#470ff4'
        ],
      ],
      'title' => [
        'display' => false,
      ]
    ]);

... который отображается в ... (одна строка):

options: {"maintainAspectRatio":false,"scales":{"xAxes":{"gridLines":{"drawOnChartArea":"false","display":"false"},"display":"false"},"yAxes":[{"ticks":{"beginAtZero":true}}]},"legend":{"display":false},"elements":{"line":{"backgroundColor":"rgba(71, 15, 244, 0.2)","borderColor":"#470ff4"}},"title":{"display":false}}

Я попытался немного отформатировать его для удобства чтения:

options: 
   {"maintainAspectRatio":false,
    "scales":{
      "xAxes":{
        "gridLines": {
          "drawOnChartArea":"false",
          "display":"false"
        },
      "display":"false"
     },
     "yAxes":
       [{"ticks":{
         "beginAtZero":true
         }}
        ]},
     "legend":{"display":false},"elements":{"line":{"backgroundColor":"rgba(71, 15, 244, 0.2)","borderColor":"#470ff4"}},"title":{"display":false}}

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

Заранее спасибо.

Редактировать Что еще не помогло, так это добавление этой строки, хотя я совершенно уверен, что она должна работать. Это не имеет смысла. Я смотрел и на другие решения, однако ответы не работают.

Порядок загрузки скриптов: Руководитель: 1. ChartJS Тело: 1. холст диаграммы, 2. конфигурация диаграммы

$this->options([
          'scales' => [
            'xAxes' => [
              'gridLines'=> [
                 'lineWidth' => 0
              ]
            ],
            'yAxes' => [
              'gridLines'=> [
                 'lineWidth' => 0
              ]
            ],
          ],
        ]);

1 Ответ

0 голосов
/ 26 июня 2018

Я нашел способ отключить оси на диаграммах Laravel (от ConsoleTV) ChartJS. Сам пакет имеет два способа сделать это.

В шаблонном классе диаграммы я добавил эти две функции:

public function __construct()
     {
       parent::__construct();
       // ...

       $this->displayAxes(false);
       $this->minimalist(true);

       // ...
     }
...