2015-11-04 2 views
0

Я использую Google Charts (тип пончика) для отображения данных в нашем приложении. Я заметил, что когда ярлык не поместится на кусочке пирога, он не отобразится. Я проверял интернет и их документацию, но я не мог найти способ манипулировать ярлыками, чтобы обернуть текст или отобразить все время.
Метка для желтого фрагмента ниже не отображается.Как показать все ярлыки в диаграмме пончиков в диаграммах Google

enter image description here

ответ

2

Она не показывает процентную этикетку, если срез составляет менее 5% (это число варьируется в зависимости от размера и ширины вашей пи графика, но это 5% в этом примере).

На рисунке ниже зеленый цвет составляет 5%, а фиолетовый - 4,9%.

enter image description here

Вот некоторые идеи о том, как справиться с этим:

1) Добавить следующие опции для вашего options объекта. Он будет сочетать все с менее чем 5% в одну разную категорию, которая будет помечена.

sliceVisibilityThreshold: 0.05, 
pieResidueSliceLabel: "Other", 

enter image description here

2) Уменьшить размер шрифта. Он по-прежнему не будет показывать ярлыки, на которые он не может поместиться, но он будет показывать больше ярлыков, потому что он сможет поместиться.

pieSliceTextStyle: { 
     color: 'black', 
     fontSize:11 
}, 

enter image description here

3) Введите области отчаянной повозка, запряженная волами и установить размер шрифта в options, что крошечная, так что все они делают, а затем использовать CSS, чтобы сделать эти ярлыки большой снова. Однако, поскольку они не подходят, и поскольку интервал все испорчен, он будет выглядеть как мусор.

pieSliceTextStyle: { 
    color: 'black', 
    fontSize:0.5 
}, 

CSS

svg g text{ 
    font-size:11px !important; 
} 

enter image description here

JSFiddle

+0

Большое спасибо! Я не знал о менее чем 5%. Определенно попробуем это. – JADE

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