2017-01-09 4 views
0

Смотрите эту codepen:Удалить Chart.js диаграммы отступы

https://codepen.io/anon/pen/xgwjMd

Я установить ширину холста на 100%, и отступы до 0, но там, кажется, некоторые внутренняя обивка на работе в графике .js. Я просмотрел документацию, но я не вижу ссылок на дополнение, кроме таких, как прокладка ярлыков.

Я пробовал редактировать его с помощью CSS, но это, похоже, не вызывает проблемы.

canvas { 
    width:100%; 
    height: auto; 
    margin:0; 
    padding:0; 
} 

Таким образом, это, вероятно, проблема с параметром рендеринга содержимого javascript.

Отсутствие контроля над этой прокладкой делает проектирование пригодного для использования отзывчивого сайта полной болью.

Если этого не происходит, есть ли у кого-нибудь предложения по альтернативным пакетам диаграмм javascript, которые хороши для чувствительных сайтов?

У меня есть опыт работы с d3, но это кажется излишним для простой круговой диаграммы.

+0

удаление 5 целых пикселей прокладки не является решением для создания адаптивного шаблона. почему бы вам не сделать графику, чтобы пройти весь путь до края, который выглядел бы ужасно. –

+0

Не совсем вопрос, который я задавал. Диаграмма, которую создает диаграмма Chart.js, фактически составляет примерно 50% ширины холста. Я хочу знать, есть ли способ увеличить ширину диаграммы до 90% ширины холста или чего-то еще. Это не вопрос CSS, который я предполагаю, возможно, больше связан с функциями рендеринга холста. Будет ли редактировать вопрос. – Satki

+0

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

ответ

0

Найден ответ - довольно простой, просто установите атрибуты высоты и ширины холста (НЕ параметры CSS) в требуемое соотношение сторон, а затем автоматически измените размер, сохраняя при этом соотношение.

Смежные вопросы