2014-10-01 2 views
0

관련 json 데이터 파일이 여러 개 있습니다. 독점 데이터에 대해 너무 많이주지 않고 간단하게 ...둘 이상의 관련 데이터 세트를 사용하는 방법은 무엇입니까?

하나의 json 파일 "businesses"은 이름, 주소 등 고유 한 ID를 갖는 비즈니스를 설명합니다. 이 수는 수십만에 달합니다.

다른 json 파일 "ratings"은 고유 한 고객 ID와 비즈니스 ID를 입력하여 고객이 제공 한 등급에 대해 1-5 등급을 보유합니다. 모든 등급은 "businesses"의 비즈니스와 일치합니다 (희망 사항). "ratings"은 훨씬 작은 파일이며 실제로 나는 수만 가지 등급 중 단지 1000 개를 사용하고 있습니다.

다른 관련 파일이 있지만 지금은이를 제한 할 것입니다.

등급의 d3 차트를 작성합니다. 각 세로 막대가 하나의 비즈니스를 나타내며 높이는 평균 평점에 의해 결정되는 막대 차트와 같습니다.

술집 위로 마우스를 가져 가면 비즈니스 이름을 볼 수 있으며이를 수행하려면 "businesses""ratings"에서 모두 그려야합니다. 처음부터 끝까지 하나의 데이터 세트로 예제 만 보았습니다.

나는 두 개의 데이터 집합을로드하고 변수에 각각 할당 :

var businesses = []; 
var ratings = []; 
d3.json("data/business.json", function(json) { 
    businesses = json; 
    console.log(businesses); 
}); 
d3.json("data/rating.json", function(json) {     
    ratings = json; 
    console.log(ratings); 
});  

두 데이터 세트가 콘솔에 나타납니다 (보통 나는 검사를 오류하지만 간단하게하기 위해 그것을 제거하고 있습니다).

var svg = d3.select("body") 
    .append("svg") 
    .attr("width", w) 
    .attr("height", h); 
svg.selectAll("rect") 
    .data(ratings) 
    .enter() 
    .append("rect") 
    (more attribs for ht, width, fill, etc.) 

내가 비즈니스 ID를 표시 할 수 있습니다 : 나는 바,이 같은 것을 만들

.append("title").text(function(d) {return "" + d.business_id ;}); 

을하지만 그것은 단지 문자, 숫자, 하이픈 및 밑줄의 의미 문자열입니다.

비즈니스 배열에서 해당 ID와 일치하는 업체명을 가장 효과적으로 뽑을 수 있습니까?


나는 그것은 작동하지 않습니다

var getBizName = function(bizId) { 
    var i; 
    for (i=0; i<businesses.length; i++) { 
     if (businesses[i].business_id==bizId) return businesses[i].name; 
    } 
}; 

호출

.append("title").text(function(d) {return getBizName(d.business_id); }); 

을 시도했다. 몇 가지 방법을 시도해 보았습니다. 제목이 전혀 표시되지 않으면 undefined이라고 말합니다. 콘솔에 getBizName(some-valid-business-id)을 입력하면 some-valid-business-id is not defined이라고 표시됩니다.

아이디어가 있으십니까? 나는이 시점에서 나는 새로운 것을 알고 있으므로 바보 같은 실수를 많이한다. 나는 또한 졸린다. 감사.

+0

어제 요청되었습니다. http://stackoverflow.com/questions/26128426/d3-how-to-dynamically-refresh-a-graph-by-changing-the-data-file-source/ –

+0

나는 ' 이것이 어떻게 효과가 있는지보십시오. 나는 같은 유형의 데이터를 가진 두 번째 파일을 사용하지 않고있다. – punstress

+0

또한 사용자는 제목을 보려면 아무 것도 클릭하지 않아도됩니다. – punstress

답변

1

businessesratings 배열의 구조를 알지 못해서 getBizName 함수가 무엇이 잘못되었지만 일반적으로 그 기술은 정상적으로 작동합니다.

는 (바 유혹하는 비즈니스 이름이 표시됩니다) 여기에 예를 참조하십시오 businesses 배열 안에 다른 곳에 깊은 http://jsfiddle.net/n1qnyv9u/

name 경우에, 당신은 잘못에 접근 할 수있다.

편집 : 당신이 businesses은 일반적으로 큰 데이터 세트이며 ratings 훨씬 작다는 말 때문에, 당신은 미리 name을 포함하는 ratings를 업데이트 array.map를 사용할 수 있습니다. 그렇게하면 ratings 바를 가리킬 때마다 getBizName 번으로 전화하지 않아도됩니다. 당신이 businessesratings에서 데이터를 얻을 후

, 이렇게 :

ratings.map(function(a) { 
    a.business_name=getBizName(a.bid); 
    return a; 
    } 
); 

지금 ratingsbusiness_name이 포함되어 있습니다. 제목 요소를 구성 할 때 아래 사항처럼 business_name를 사용 : 여기

.append("title").text(function(d) { return d.business_name; }); 

업데이트 바이올린 : http://jsfiddle.net/n1qnyv9u/2/

당신은 또한 더 나은 찾고 툴팁 https://github.com/Caged/d3-tip보고 할 수 있습니다.

+0

코드를 조정 했는데도 여전히 이상하게 작동하지 않는 오류가 발생합니다. – punstress

+0

내 거대한 데이터 세트와 함께 작업하면 매우 흥분됩니다. 정말 고마워! – punstress

관련 문제