2015-12-11 2 views
0

Я новичок в программировании, поэтому, пожалуйста, пройдите, если я не понимаю, с моим объяснением ... В представлении Web2Py у меня есть div с id = "convgraphdata "содержащие числа, которые я хотел бы построить с ChartJS. Цифры варьируются в зависимости от ввода, но выглядят следующим образом: [4,6,7,3,20,46, ...]. Поскольку я хочу создавать динамические данные, я бы хотел, чтобы ChartJS взял текст из div, преобразовал его в массив, а затем построил данные в массиве. Я пробовал так много способов захватить данные из div и не могу заставить его работать.Захват массива из текста div в график с помощью ChartJS

Например, код ChartJS является:

var lineChartData = { 
    labels : days(), 
    datasets : [ 
     { 
      label: "My First dataset", 
      fillColor : "rgba(220,220,220,0.2)", 
      strokeColor : "rgba(220,220,220,1)", 
      pointColor : "rgba(220,220,220,1)", 
      pointStrokeColor : "#fff", 
      pointHighlightFill : "#fff", 
      pointHighlightStroke : "rgba(220,220,220,1)", 
      data : convdata() 
     }]} 
window.onload = function(){ 
    var ctx = document.getElementById("canvas").getContext("2d"); 
    window.myLine = new Chart(ctx).Line(lineChartData, { 
     responsive: true 
    }); 
} 
function days() { 
    var days = []; 
    for (var i = 1; i <= 365; i++) {days.push(i);}; 
    return days;} 

И функция convdata(), где у меня возникли проблемы. Мой код:

function convdata() { 
    var convdata = []; 
    var data1 = document.getElementById("convgraphdata").textContent.slice(1, -1); 
    var convdata = data1.split(",").map(Number); 
    return convdata;} 

Я также пробовал множество других методов. Граф не загружается, когда я включаю код для захвата текста из div. Не уверен, что это полезно, но содержимое div является результатом вызова AJAX в Web2Py. Web2Py любит возвращать результаты в HTML-элемент, но если есть другой способ отправить его прямо в массив ChartJS, это также может работать. Любая помощь очень ценится.

Anthony, в ответ на ваш вопрос, полная функция длинная и сложная, поэтому я объясню здесь краткое объяснение ... Функция javascript подбирает данные внутри входных данных javascript, а затем отправляет их на сервер, используя стандарт Web2Py функция Ajax в формате:

function conv_model(){ 
    ajax(['graph'],['select1', 'rate1', 'waittime1'], 'convgraphdata');} 

функция на стороне сервера в питоне проходит расчет на данных и возвращает результат в стороне клиента DIV с идентификатором и именем «convgraphdata». Эти данные - это то, что я хочу на графике в ChartJS.

на сторону сервера, функция питона в формате:

def graph(): 
# numerous calculations on user inputs 
return dict(totalN=totalN) 

Существует также вид называется graph.html, который содержит код:

{{=totalN}} 

Надеется, что это достаточно подробно.

+0

Там нет необходимости иметь web2py записать результаты Ajax в div (есть другие варианты). Пожалуйста, покажите вызов Ajax, а также код Python, который генерирует ответ. – Anthony

ответ

0

Вы говорите:

web2py любит возвращать результаты в HTML-элемент

Но это только то, что встроенные функции Ajax делает.

Вы можете получить всегда данные из контроллера с JQuery (в комплекте с web2py):

function getData() { 
    $.ajax({ 
    url: "your_controller/get_data.json?", 
    data: { input1: "hello", input2: "bye"}, 
    success: function(result){ 
     //do what you want with result... 
    } 
    }); 
} 

В контроллере:

def get_data(): 
    response.view = 'generic.json' 
    a = request.vars.input1 
    b = request.vars.input2 
    return {data: [1, 2, 4, 67]} 
+0

спасибо за вашу идею, красиво описал, чтобы я мог легко понять. Он может работать, но мне также нужно отправить пользователям входные данные из входных данных javascript на серверную функцию get_data(). Вот почему я использовал функцию ajax по умолчанию для Web2py, ajax (['get_data'], ['input1', 'input2', ...], 'target'); Можно ли заменить «цель» на функцию (результат) на стандартную функцию Ajax, чтобы я мог по-прежнему отправлять входы от клиента на сервер? Или есть другой способ отправить входы в функцию ajax, которую вы предложили? – Sam

+0

Я отредактировал свой ответ, чтобы показать, как передавать входные данные базовым способом. – andyhasit

+0

Спасибо за обновление. Код работает, чтобы передать массив в другую функцию javascript. Это было очень полезно, чтобы показать мне, как это сделать, так что спасибо. К сожалению, ChartJS по-прежнему не хочет его распознавать. Я протестировал отправку массивов из некоторых функций javascript, и он сработал нормально, но я не могу заставить его обновить результат ajax. В это время я переключился на Google Charts, так как было намного проще нарисовать результат ajax. Спасибо за вашу помощь. – Sam