C3. js повернутые тики названия категории длинных осей X перекрываются - PullRequest
Новая
       73

C3. js повернутые тики названия категории длинных осей X перекрываются

0 голосов
/ 20 марта 2020

Я долго искал и не смог получить ответ на мою конкретную c проблему. Мне нужен график , работающий на мобильном телефоне с категориальными данными по оси Y и числовыми данными по оси X, представляющими Название продукта v / s Количество продано .

Я использовал C3 и вращал оси, поэтому ось X имеет категориальные данные, а ось Y - числовые. Проблема в том, что категориальные метки слишком длинные и они перекрываются по вертикали, например: Graph with rotated axes and tick labels overlapped

Не берите в голову метки, я просто тестировал фиктивные данные, но поведение такое же , Я использовал следующий код: 

var chart = c3.generate({
    data: {
        x: 'x',
        columns: [
            ['x', 'nombre muy muy pero demasiado largo de categoría', 'acá otro nombre demasiado largo de categoría', '2013-01-03', '2013-01-04', '2013-01-05', '2013-01-06', '2013-01-07', '2013-01-08', '2013-01-09', '2013-01-10', '2013-01-11', 'otro nombrecito bien largo para la categoría a pesar de que no es necesario'],
            ['sample', 30, 200, 100, 400, 150, 250, 30, 200, 100, 400, 150, 250]
        ],
        type: 'bar'
    },
    axis: {
        x: {
            type: 'category',
        },
        rotated: true
    },
    legend: {
        show: false
    }
});

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

...