showR2를 Google 차트의 맞춤 텍스트로 바꾸시겠습니까?

Question

Google Chart에서 특정 방식으로 보이기 위해 놀고 있습니다. 이 상황에서 저는 콤보 차트에 선과 세로 막 대형 차트가 있습니다.

난 그냥 일부 사용자 지정 텍스트로 show2r 전설을 교체하는 방법 "레이아웃"문제

1. 전망 우연히 있나요? 에서 순간은 다음과 같이 말합니다 : y = 2.032E-4 * x-8.203 r^2 = 7.005E-3 그리고 은 "Trendline (Lineair) 2/또한 범례는 1/2을 얻습니다.3/x 축에 모든 날짜가 표시되지 않는다면, 어떻게하면 을 기본값으로 설정할 수 있습니까? 4/말하기에 세로선을 추가하려면 어떻게합니까? 6월 ??

감사

Answer 1

범례에서 추세선 레이블을 변경하기 위해 사용 옵션 ->labelInLegend

수동으로 이벤트를 사용하여 툴팁의 값을 변경할 수있는 표준 옵션,
하지만이 변경 될 수 없다 ->onmouseover

은 당신이 옵션을 사용할 수 있습니다

전설의 위치가 top입니다 - 가능한 행의 수를 증가시키고 화살표를 방지하기>legend.maxLines
을 ...

모든 날짜는 x 축에 표시됩니다 확인하기 위해,
이 옵션을 사용하여 충분한 공간을 허용 ->chartArea.bottom

각각의 예 작업 조각을 다음을 참조 ...

google.charts.load('current', { 
 
    packages: ['corechart'] 
 
}).then(function() { 
 
    var data = google.visualization.arrayToDataTable([ 
 
    ['x', 'y0', 'y1'], 
 
    [new Date(2017, 11, 28), 175, 10], 
 
    [new Date(2017, 11, 29), 159, 20], 
 
    [new Date(2017, 11, 30), 126, 35], 
 
    [new Date(2017, 11, 31), 129, 40], 
 
    [new Date(2018, 0, 1), 108, 60], 
 
    [new Date(2018, 0, 2), 92, 70] 
 
    ]); 
 

 
    var options = { 
 
    chartArea: { 
 
     bottom: 72 
 
    }, 
 
    hAxis: { 
 
     slantedText: true 
 
    }, 
 
    height: 400, 
 
    legend: { 
 
     maxLines: 2, 
 
     position: 'top' 
 
    }, 
 
    tooltip: { 
 
     isHtml: true 
 
    }, 
 
    trendlines: { 
 
     0: { 
 
     labelInLegend: '0-Linear Trend', 
 
     showR2: true, 
 
     type: 'linear', 
 
     visibleInLegend: true 
 
     }, 
 
     1: { 
 
     labelInLegend: '1-Linear Trend', 
 
     showR2: true, 
 
     type: 'linear', 
 
     visibleInLegend: true 
 
     } 
 
    }, 
 
    width: 400 
 
    }; 
 

 
    var container = document.getElementById('chart_div'); 
 
    var chart = new google.visualization.ColumnChart(container); 
 

 
    google.visualization.events.addListener(chart, 'onmouseover', function (props) { 
 
    var tooltipLabels = container.getElementsByTagName('span'); 
 
    for (var i = 0; i < tooltipLabels.length; i++) { 
 
     if (tooltipLabels[i].innerHTML.indexOf('y =') > -1) { 
 
     tooltipLabels[i].innerHTML = 'CUSTOM TEXT:'; 
 
     } 
 
    } 
 
    }); 
 

 
    chart.draw(data, options); 
 
});

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="chart_div"></div>