Как обновить данные Protovis с помощью функции Javascript?

Question

Я рисую диаграмму, используя «Protovis Mean & Deviation Example». В моем HTML файл я включил этот protovis код:

<script type="text/javascript+protovis"> 

/* Convert from tabular format to array of objects. */ 
var cols = nba.shift(); 
nba = nba.map(function(d) pv.dict(cols, function() d[this.index]));  
cols.shift(); 

/* The color scale ranges 3 standard deviations in each direction. */ 
var x = pv.dict(cols, function(f) pv.mean(nba, function(d) d[f])), 
s = pv.dict(cols, function(f) pv.deviation(nba, function(d) d[f])), 
fill = pv.dict(cols, function(f) pv.Scale.linear(0, 50,100).range('red', 'yellow', 'green')); 

var w = 50, h = 20; 

var vis = new pv.Panel() 
.width(cols.length * w) 
.height(nba.length * h) 
.top(70) 
.left(100.5) 
.right(.5) 
.bottom(.5); 

vis.add(pv.Panel) 
.data(cols) 
.left(function() this.index * w) 
.width(w) 
.add(pv.Panel) 
.data(nba) 
.top(function() this.index * h) 
.height(h) 
.strokeStyle("white") 
.lineWidth(1) 
.fillStyle(function(d, f) fill[f](d[f])) 
.title(function(d, f) d.Name + "'s " + f + ": " + d[f]); 

vis.add(pv.Label) 
.data(cols) 
.left(function() this.index * w + w/2) 
.top(0) 
.textAngle(-Math.PI/2) 
.textBaseline("middle"); 

vis.add(pv.Label) 
.data(nba) 
.left(0) 
.top(function() this.index * h + h/2) 
.textAlign("right") 
.textBaseline("middle") 
.text(function(d) d.Name); 

vis.render(); 

</script> 

Теперь, чтобы обеспечить protovis с действительными данными, я написал функцию Javascript. Соответствующий код из моей яваскрипта функции ниже:

 for(var k=0; k< xlabelValues.length; k++){   //xAxis header values are in xlabelValues 
      nba[0][k+1] = xlabelValues[k];    
     } 

     for(var k=0; k< ylabelValues.length; k++){   //yAxis header values are in ylabelValues 
      nba[k+1] = []; 
      nba[k+1][0] = ylabelValues[k]; 
      for(var e=1; e<nba[0].length; e++){    
       zValue = hash3D[nba[0][e]+","+ylabelValues[k]]; //hash3D contains numeric values for (x,y) as KEY 
       if(typeof zValue == "undefined"){ 
        nba[k+1][e] = 0; 
       }else{ 
        nba[k+1][e] = zValue; 
       } 
      } 
     } 

Эта функция заполнит «» структуру НБА данных для protovis. Структура данных действительна по мере необходимости. Образец такой структуры данных ниже:

var nba = [ 
["","January","Feburary","March","April","May","June","July","August","Sep temebr","October","November","December"], 
["Event 1",79,38.6,30.2,10.8,22,0.491,7.5,9.8,0.765,1.1,3.5,0.317], 
["Event 2",81,37.7,28.4,9.7,19.9,0.489,7.3,9.4,0.78,1.6,4.7,0.344], 
["Event 3",82,36.2,26.8,9.8,20.9,0.467,5.9,6.9,0.856,1.4,4.1,0.351], 
["Event 4",81,37.7,25.9,9.6,20,0.479,6,6.7,0.89,0.8,2.1,0.359] 
]; 

ПРОБЛЕМА: Поскольку protovis скрипт на мой файл main.html в тэге, поэтому, как я должен пройти protovis этой «» структуру НБА данных? Я хочу, чтобы код protovis выполнялся после того, как я заполнил «nba» своей функцией javascript.

Надеюсь, я устранил свою проблему, ожидая предложений и решений. Спасибо вам большое за ваше время.

Answer 1

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

Все функции protovis или d3 в основном работают с сохраненными данными json или csv. Здесь: var nba = json.

Я предполагаю, что функция не автоматически заполнять:

var cols = data.shift(); 
    nba = data.map(function(d) pv.dict(cols, function() d[this.index])); 
    cols.shift(); 

Так что единственное, что вам нужно сделать, это изменить ДАННЫЕ и добавить этот скрипт для вас HTML или PHP страницу как НБА. js вместе с этим скриптом.

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

Приветствия к этим очень полезным библиотекам!