Jump to content
pessantiago

Combo box

Recommended Posts

pessantiago

Boa tarde

estou com duvidas ja andei a pesquisar e nada

é ó seguinte tenho de fazer um grafico de barras em d3, com filtragem dos mesmos

exemplo de dados

data,codcurso,disciplina,inscritos,aprovados,reprovados

2009,a1,1,40,30,10

2009,a1,2,30,20,10

2009,a1,2,50,40,10

2010,a1,1,40,30,10

2011,a1,1,20,10,10

pretendo ter uma uma combobox para selecionar o ano,codcurso e discplina nesse curso e depois gerar um grafico de barras com inscritos,aprovados,reprovados.

Apresentar os anos todos de uma determinada disciplina

ajudas

Share this post


Link to post
Share on other sites
KTachyon

Esqueceste-te de dizer qual é a dúvida.


“There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies, and the other way is to make it so complicated that there are no obvious deficiencies. The first method is far more difficult.”

-- Tony Hoare

Share this post


Link to post
Share on other sites
pessantiago

exato, como é que faço ao selecionar o ano 2009 aprensentar os cursos a1,a1 e ao selecionar os cursos apresentar as respetivas disciplinas

Share this post


Link to post
Share on other sites
KTachyon

Tens que tratar a informação com Javascript. Fazes um split linha a linha e colocas a informação em estruturas de dados adequadas:

var lines = data.split('\n');
var objects = [];

for (var i = 0; i < lines.length; i++) {
   var splittedLine = lines[i].split(',');

   objects.push({
       ano : splittedLine[0],
       codcurso : splittedLine[1],
       disciplina : splittedLine[2],
       inscritos : splittedLine[3],
       aprovados : splittedLine[4],
       reprovados : splittedLine[5],
   });
}

Para procurares:

var objects2009 = [];

for (var i = 0; i < objects.length; i++) {
   if (parseInt(objects[i].ano) === 2009) {
       objects2009.push(objects[i]);
   }
}

Alternativamente, se utilizares uma biblioteca como underscorejs ou lodash:

var lines = data.split('\n');
var objects = _.map(lines, function(line) {
   var splittedLine = line.split(',');

   return {
       ano : splittedLine[0],
       codcurso : splittedLine[1],
       disciplina : splittedLine[2],
       inscritos : splittedLine[3],
       aprovados : splittedLine[4],
       reprovados : splittedLine[5],
   };
});

E:

var objects2009 = _.filter(objects, function(object) {
   return parseInt(objects[i].ano) === 2009;
});


“There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies, and the other way is to make it so complicated that there are no obvious deficiencies. The first method is far more difficult.”

-- Tony Hoare

Share this post


Link to post
Share on other sites
pessantiago

obrigado, pela ajuda...vou tentar fazer se tiver algum problema coloco aqui

Share this post


Link to post
Share on other sites
pessantiago

não é isto, prentendo é ter uma lista que se auto actualiza..as combo box isto é selects

é o codigo que tenho depois consoante a informção filtrada gera um grafico, mas para ja quero colocar a info nos selects

por exemplo varias disciplinas tem vários cursos(departamentos)

<!DOCTYPE html>
</html>
<meta charset="utf-8">
<style>
body {
font: 10px sans-serif;
}
.arc path {
stroke: #fff;
}
</style>
<head>
</head>
<body>
Selecionar Ano:
<select id="SelectAno" >
<option value="Todos">Todos</option>
</select>
Curso:
<select id="Curso">Todos</option>

</select>
Disciplinas:
<select id="Disciplinas" >
</select>
<script type="javascript" src="http://d3js.org/d3.v3.min.js"></script>
<script>
var SelectAno;//para guardar a combo box dos anos
//inicializar combo boxs;
initSelectAnos();
function initSelectAnos(){
var data = [];
SelectAno = document.getElementById("SelectAno");
d3.csv("2009.csv", function(error,csv) {
for(var i=0;i<csv.length;i++){
var splittedLine = csv[i].split(',');
objects.push({AnoLectivo: splittedLine[0]});
}
})
};
</script>

</body>
</html>

Share this post


Link to post
Share on other sites
KTachyon

Eu só te expliquei aquilo que tu perguntaste, que é, como é que deves tratar os dados.

Basicamente, depois de tratares os dados, podes extrair os anos que tens disponíveis e colocas esses valores no select. Adicionas um bind ao evento "change" do select para apanhares a alteração de valores e mandares actualizar o d3.


“There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies, and the other way is to make it so complicated that there are no obvious deficiencies. The first method is far more difficult.”

-- Tony Hoare

Share this post


Link to post
Share on other sites
KTachyon

Mas vais ter que começar a dominar, até porque o d3 implica Javascript.


“There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies, and the other way is to make it so complicated that there are no obvious deficiencies. The first method is far more difficult.”

-- Tony Hoare

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.