가로 축 레이블을 클릭 할 수 있도록하기

Question

구글 차트 (칼럼 차트)와 관련된 질문이 있습니다.
"외부 페이지와 함께 모달 대화 상자 (jQuery)를 열 수 있도록"날짜 "를 클릭 가능하게 만드는 방법은 무엇입니까?

내가 무슨 뜻인지 설명하기 위해 예제를 추가했습니다. 이것은 분명히 Photoshop에서 수행되었습니다.
막대 중 하나를 클릭하면 경고 대화 상자를 표시 할 수 있지만 실제로는 찾지 않습니다.

검색을 시도했지만 찾을 수 없습니다.
바를 클릭 할 수있게하기 위해 사용하는 코드가 첨부되어 있습니다. 어쩌면 누군가 Google을 사용하지 않아도이를 수정할 수있는 방법을 알고있을 것입니다.

var handler = function(e) { 
    var sel = chart.getSelection(); 
    sel = sel[0]; 
    if (sel && sel['row'] && sel['column']) { 
     var message = "Hi.."; 
     alert(message); 
    } 
} 
google.visualization.events.addListener(chart, 'select', handler); 

어떤 도움이라도 대단히 감사하겠습니다. - Robert.

Answer 1

'select' 처리기 대신 'click' 처리기를 사용하면 더 쉽게 차트의 다른 부분과 상호 작용할 수 있습니다.

다음은 예입니다 : http://jsfiddle.net/6LJhv/6/이

귀하의 이벤트 객체, e가하는 targetID 속성이 있습니다.

이 targetID은 잘 설명되어 있지 않지만 디버거를 실행하면 어떤 ID가 보이는지 알 수 있습니다.

다양한 축 차트 (선, 열 등)에서 targetID 축 레이블의 모양은 hAxis#0#label#1입니다. 이를 해소하기 위해서는 첫 번째 수평 축 (0 기준 인덱스)의 두 번째 레이블을 클릭했음을 의미합니다.

이 점을 감안하면 targetID을 분석하여 이산 인 경우 어떤 라벨을 클릭했는지 파악할 수 있습니다.

가 (데이터가 연속 인 경우, 반드시 1이되지 않습니다 : 데이터의 레이블 및 행 1의 관계) 내 코드에서

var handler = function(e) { 
    var parts = e.targetID.split('#'); 
    if (parts.indexOf('label') >= 0) { 
     var idx = parts[parts.indexOf('label') + 1]; 
     alert(data.getValue(0, parseInt(idx))); 
    } 
}; 
google.visualization.events.addListener(chart, 'click', handler);