Блог

Я пытаюсь создать круговую диаграмму, используя d3pie.js значения, введенные пользователем. Ниже приведен мой функциональный код, который принимает случайные числа при нажатии кнопки.

Но я не хочу, чтобы новое значение сегмента было взято из поля ввода пользователя. Я попытался присвоить переменной функцию jquery, а затем присвоить этой переменной значение, как показано ниже, но это не сработало. Я также попытался напрямую определить функцию Jquery для определения значения.

Попытка 1 (не сработала):

 var a = $("#first").val();
var num = 4;

$("#addData").on("click", function() {

adata.push({
  label: num.toString(),
  value: a
});

pie.updateProp("data.content", adata);
num  ;
  

Попытка 2 (не сработала):

 adata.push({
label: num.toString(),
value: $("#first").val()
});
  

Ниже приведен мой рабочий код, я был бы очень признателен за некоторые комментарии от людей по этому поводу.

 var adata = [
        {
            "label": "JavaScript",
            "value": 5,         
        },
        {
            "label": "Ruby",
            "value": 3,             
        },
        {
            "label": "Java",
            "value": 2,             
        }   
    ];
--------------------
"data": {
    "sortOrder": "value-desc",
    "content": adata
--------------------
var num = 4;
$("#addData").on("click", function() {
adata.push({
  label: num.toString(),
  value: Math.floor(Math.random() * 10)   1
});
pie.updateProp("data.content", adata);
num  ;

--------------------
<input type="text" class="form-control" id="first">
<button type="button" class="btn btn-default" id="addData">Add Value</button>
  

Проблема в том, что вы передаете строку value , она ожидает число.

в вашем коде

 adata.push({
  label: num.toString(),
  value: a //incorrect it has to be a number.
});
  

нужно сделать

  adata.push({
  label: num.toString(),
  value:  $("#first").val() //make it a number so   is appended.
});
  

рабочий код здесь