2017-10-29 4 views
0

Google Charts API를 사용하여 타임 라인을 만들었습니다.Google 타임 라인에서 '선택한'툴팁을 사용 설정하는 방법은 무엇인가요?

<html> 
    <head> 
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 

<script type="text/javascript"> 
    google.charts.load("current", {packages:["timeline"]}); 
    google.charts.setOnLoadCallback(drawChart); 
    function drawChart() { 

    var today = new Date(); 
    var datenow= today.getFullYear()+','+(today.getMonth()+1)+','+today.getDate(); 
    var container = document.getElementById('example3.1'); 
    var chart = new google.visualization.Timeline(container); 
    var dataTable = new google.visualization.DataTable(); 
    dataTable.addColumn({ type: 'string', id: 'Position' }); 
    dataTable.addColumn({ type: 'string', id: 'Name' }); 
    dataTable.addColumn({ type: 'date', id: 'Start' }); 
    dataTable.addColumn({ type: 'date', id: 'End' }); 
    dataTable.addRows([ 
     [ 'Arrgh\'s Era', 'Arrgh\'s Era', new Date(2014, 11, 19), new Date(datenow)], 
     [ 'Grand Admiral', 'Ogaden', new Date(2014, 11, 19), new Date(2015, 4, 18) ], 
     [ 'Grand Admiral', 'Warpool', new Date(2015, 4, 19), new Date(2015, 5, 18) ], 
     [ 'Grand Admiral', 'Ogaden', new Date(2015, 5, 19), new Date(2015, 11, 18) ], 
     [ 'Grand Admiral', 'Jacob Hanson', new Date(2015, 11, 19), new Date(2016, 3, 18)], 
     [ 'Grand Admiral', 'Ogaden', new Date(2016, 3, 19), new Date(2016, 10, 18)], 
     [ 'Grand Admiral', 'DragonK', new Date(2016, 10, 19), new Date(2017, 3, 18)], 
     [ 'Grand Admiral', 'Bluebear', new Date(2017, 3, 19), new Date(2017, 9, 18)], 
     [ 'Grand Admiral', 'Ripper', new Date(2017, 9, 19), new Date(datenow)], 
    ]); 

    chart.draw(dataTable); 
    } 
</script> 


    </head> 
    <body> 
    <div id="example3.1" style="height: 200px;"></div> 
    </body> 
</html> 

The resulting Timeline

는 내가 달성하고자하는 툴팁이 막대를 선택한 경우에만 (공중 선회하지 않음)에서 볼 수 있어야한다는 것입니다. 차트 options에서 tooltip: { trigger: 'selection' }을 사용해 보았습니다. 빈 페이지가 생깁니다.

내가 뭘 잘못하고 있니? Google Chart API 페이지에서 다른 방법을 본 적이 있지만 타임 라인이 아닌 다른 차트 유형에서는 작동하는 것 같습니다.

답변

0

타임 라인 차트는 '포커스'또는 '없음'으로 트리거 값만 설정할 수 있으며 기본값은 '포커스'이며 마우스를 올리면됩니다. 또 다른 문제는 타임 라인 차트의 툴팁이 지속되지 않는다는 것입니다.

관련 문제