總覽
十字線是細長的水平線，以圖表上的資料點為中心當您以圖表建立者的身分為圖表啟用交叉定位時，使用者將能夠指定單一元素：
十字瞄準線可以顯示在焦點或選項上，或同時顯示兩者。可用於散佈圖、折線圖、面積圖，以及組合圖的線條和面積部分。
簡易範例
將遊標懸停在下方的要點或選取這些點，即可查看交叉線：
以下是建立上圖的完整網頁，此線條為粗體，代表交叉線的線條：
<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load("current", {packages:["corechart"]});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('number');
data.addColumn('number');
for (var i = 0; i < 100; i++)
data.addRow([Math.floor(Math.random()*100),
Math.floor(Math.random()*100)]);
var options = {
legend: 'none',
crosshair: { trigger: 'both' } // Display crosshairs on focus and selection.
};
var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="chart_div" style="width: 900px; height: 500px;"></div>
</body>
</html>
十字瞄準線選項
可用的十字瞄準線選項如下：
crosshair: { trigger: 'both' } | 在焦點和選取位置上顯示 |
crosshair: { trigger: 'focus' } | 只顯示焦點 |
crosshair: { trigger: 'selection' } | 只在選取時顯示 |
crosshair: { orientation: 'both' } | 顯示水平髮型和垂直髮型 |
crosshair: { orientation: 'horizontal' } | 僅顯示水平髮型 |
crosshair: { orientation: 'vertical' } | 僅顯示直髮 |
crosshair: { color: color_string } | 請將十字染色設為 color_string，例如：'red' 或 '#f00' |
crosshair: { opacity: opacity_number } | 將十字架透明度設為 opacity_number，0.0 表示完全透明，1.0 完全不透明 |
crosshair: { focused: { color: color_string } } | 將焦點設為十字染色，並將顏色設為 color_string |
crosshair: { focused: { opacity: opacity_number } } | 將焦點在十字架上的透明度，設為 opacity_number |
crosshair: { selected: { color: color_string } } | 選取選項時，將十字染色設為 color_string |
crosshair: { selected: { opacity: opacity_number } } | 選取時將十字架的透明度設為 opacity_number |