Как я могу изменить текст легенды в круговой диаграмме C3

Как я могу изменить текст легенды круговой диаграммы. Я использую диаграммы c3 на своей странице php. Я уже прочитал документацию диаграмм с3, но не повезло.

В настоящее время я использую этот код, он показывает легенду для true но я не смог изменить текст, я попробовал это.

var chart = c3.generate({
bindto: '#container',
padding: {
top: 10,
right: 0,
bottom: 10,
left: 0,
},
data: {
columns: [<?php echo $pieChartDataString; ?>],
type : 'pie',
labels: true
},
legend: {
show: true,
position: 'upper-center'
format: {
title: function () { return "Legend title"; },
name : function () { return "Legend name"; },
value: function () { return "Legend value";}
}
}

//But these legend values or not showing

});

Он не показывает значения моей легенды, он всегда показывает только столбцы как легенду.

Есть ли способ, которым я могу изменить значения легенды.

9

Решение

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

Но первый элемент в каждом из столбцов массива определяет имя, которое идет в легенде. Так:

columns: [
['this is legend 1', 30],
['put your value here', 120],
]

приведет к тому, что метки легенды будут «это легенда 1» и «поместите свою ценность здесь».

Вот скрипка:
http://jsfiddle.net/jrdsxvys/9/

Редактировать…
Другой вариант — использовать свойство names, как здесь сделано:
http://jsfiddle.net/jrdsxvys/40/

data: {
columns: [
['d1', 30],
['d2', 120]
],
type: 'pie',
labels: true,
names: {
d1: 'some name here',
d2: 'another name'
}
}
12

Другие решения

@agpt Да. names Свойство обычно является хорошим способом определения, потому что первое свойство массива данных столбцов, например, ‘d1’ выше, используется при выполнении таких задач, как наличие нескольких типов в диаграммах. например, для комбинации бара и линии, используя types вместо type: 'pie':

columns: [
['bar_1', 3, 8, 6],
['bar_2', 4, 0, 7],
['bar_3', 2, 3, 0]
],

types: {
bar_1: 'bar',
bar_2: 'line',
bar_3: 'bar'
},

names : {
bar_1: 'Initial',
bar_2: '3 month',
bar_3: '6 month'
}

Таким образом, использование свойства names позволяет вам использовать более «динамические» имена свойств и быть последовательными во всем конфиге.

1

Как я могу изменить текст легенды круговой диаграммы. Я использую диаграммы c3 на своей странице php. Я уже прочитал документацию диаграмм с3, но не повезло.

В настоящее время я использую этот код, он показывает легенду для true но я не смог изменить текст, я попробовал это.

var chart = c3.generate({
bindto: '#container',
padding: {
top: 10,
right: 0,
bottom: 10,
left: 0,
},
data: {
columns: [<?php echo $pieChartDataString; ?>],
type : 'pie',
labels: true
},
legend: {
show: true,
position: 'upper-center'
format: {
title: function () { return "Legend title"; },
name : function () { return "Legend name"; },
value: function () { return "Legend value";}
}
}

//But these legend values or not showing

});

Он не показывает значения моей легенды, он всегда показывает только столбцы как легенду.

Есть ли способ, которым я могу изменить значения легенды.

9

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

Но первый элемент в каждом из столбцов массива определяет имя, которое идет в легенде. Так:

columns: [
['this is legend 1', 30],
['put your value here', 120],
]

приведет к тому, что метки легенды будут «это легенда 1» и «поместите свою ценность здесь».

Вот скрипка:
http://jsfiddle.net/jrdsxvys/9/

Редактировать…
Другой вариант — использовать свойство names, как здесь сделано:
http://jsfiddle.net/jrdsxvys/40/

data: {
columns: [
['d1', 30],
['d2', 120]
],
type: 'pie',
labels: true,
names: {
d1: 'some name here',
d2: 'another name'
}
}
2

@agpt Да. names Свойство обычно является хорошим способом определения, потому что первое свойство массива данных столбцов, например, ‘d1’ выше, используется при выполнении таких задач, как наличие нескольких типов в диаграммах. например, для комбинации бара и линии, используя types вместо type: 'pie':

columns: [
['bar_1', 3, 8, 6],
['bar_2', 4, 0, 7],
['bar_3', 2, 3, 0]
],

types: {
bar_1: 'bar',
bar_2: 'line',
bar_3: 'bar'
},

names : {
bar_1: 'Initial',
bar_2: '3 month',
bar_3: '6 month'
}

Таким образом, использование свойства names позволяет вам использовать более «динамические» имена свойств и быть последовательными во всем конфиге.

active «data-shortcut =» A
самый старый «data-shortcut =» O
голосует «data-shortcut =» V
12