Фильтрация данных в гистограмме с использованием d3.js - PullRequest
0 голосов
/ 23 сентября 2019

[enter code here][1] Я извлек данные из Elasticsearch и отобразил их на гистограмме с помощью D3.js, но проблема здесь в том, что мне нужно отфильтровать их.Например, если у меня есть некоторый sessionID по оси Y и байты по оси X и в раскрывающемся списке, у меня есть имена пользователей.

Если я выбираю одного конкретного пользователя, соответствующие данные конкретного пользователя должны отображаться на графике, но я получаю все соответствующие данные всех пользователей на гистограмме

Мои данные JSON в ElasticSearch: (образец)

{  
   "took":1,
   "timed_out":false,
   "_shards":{  
      "total":2,
      "successful":2,
      "skipped":0,
      "failed":0
   },
   "hits":{  
      "total":14,
      "max_score":1.0,
      "hits":[{  
            "_index":"common_log_mapped",
            "_type":"doc_type",
            "_id":"1569219826987",
            "_score":1.0,
            "_source":{  
               "id":"1569219826987",
               "user":"Vaish",
               "sessionID":"113011",
               "bytes":95,


 },
 {  
            "_index":"common_log_mapped",
            "_type":"doc_type",
            "_id":"1569219107755",
            "_score":1.0,
            "_source":{  
               "id":"1569219107755",
               "user":"user Jags",
               "sessionID":"113003",
               "bytes":96,

 }

]
}
}


  var selector = d3
        .select("#drop")
        .append("select")
        .attr("id", "dropdown")
        .on("change", function(d) {
          selection = document.getElementById("dropdown");

          y.domain([
            0,
            d3.max(data, function(d) {
              return d.bytes;
            })
          ]);

          yAxis.scale(y);

          d3.selectAll(".rectangle")
            .transition()
            .attr("height", function(d) {
             // return height - y(+d[bytes.key]);
             return height - y(d.bytes);
            })
            .attr("x", function(d, i) {
              return (width / data.length) * i;
            })
            .attr("y", function(d) {
            //  return y(+d[bytes.value]);
            return y(d.bytes);
            })
            .ease("linear")
            .select("title")
            .text(function(d) {
              return d.bytes ;
            });

          d3.selectAll("g.y.axis")
            .transition()
            .call(yAxis);
        });

      selector
        .selectAll("option")
        .data(allGroup)
        .enter()
        .append("option")
        .attr("value", function(d) {
     //     return d;
        })
        .text(function(d) {
        return d;   
        });

Ожидаемый результат: Если я выберу одного конкретного пользователя, я получу соответствующий график. Фактический результат: Получение всей панели для всех данных пользователя

Добавлена ​​ссылка на скрипку:

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...