Question

我使用谷歌图表显示折线图。但是工具提示有位置问题。我已经找到了解决方案，但我无法得到任何解决方案。这是我的代码。请给我解决方案。谢谢你提前。

function drawBasic() {
    var data = new google.visualization.DataTable();
    data.addColumn('date', 'Date');
    data.addColumn('number', 'Price');

    data.addRows([
        [0, 0],
        [1, 10],
        [2, 23],
        [3, 17],
        [4, 18],
        [5, 9],
        [6, 11],
        [7, 27],
        [8, 33],
        [9, 40],
        [10, 32],
        [11, 35],
        [12, 30],
        [13, 40],
        [14, 42],
        [15, 47],
        [16, 44],
        [17, 48],
        [18, 52],
        [19, 54],
        [20, 42],
        [21, 55],
        [22, 56],
        [23, 57],
        [24, 60],
        [25, 50],
        [26, 52],
        [27, 51],
        [28, 49],
        [29, 53],
        [30, 55],
        [31, 60],
        [32, 61],
        [33, 59],
        [34, 62],
        [35, 65],
        [36, 62],
        [37, 58],
        [38, 55],
        [39, 61],
        [40, 64],
        [41, 65],
        [42, 63],
        [43, 66],
        [44, 67],
        [45, 69],
        [46, 69],
        [47, 70],
        [48, 72],
        [49, 68],
        [50, 66],
        [51, 65],
        [52, 67],
        [53, 70],
        [54, 71],
        [55, 72],
        [56, 73],
        [57, 75],
        [58, 70],
        [59, 68],
        [60, 64],
        [61, 60],
        [62, 65],
        [63, 67],
        [64, 68],
        [65, 69],
        [66, 70],
        [67, 72],
        [68, 75],
        [69, 80]
    ]);

    var options = {
        'height': 200,

        trendlines: {
            0: {
                color: 'green',
                tooltip: false,
                labelInLegend: 'Trendline',
                visibleInLegend: true
            }
        },

        title: '2 Year Historical Daily Stock Price',
        chartArea: {
            left: 70,
            width: "60%"
        },
        legend: {
            position: 'right',
            textStyle: {
                fontSize: 8
            }
        },
        timeline: {
            groupByRowLabel: true
        },
        hAxis: {
            title: 'Date (drag to zoom, right click to reset)',
            format: 'MMM yy',
            textStyle: {
                fontSize: 5
            },
            gridlines: {
                count: 6
            }
        },
        vAxis: {
            title: 'USD $'
        },
        explorer: {
            axis: 'horizontal',
            actions: ['dragToZoom', 'rightClickToReset']
        }
    };

    var chart = new google.visualization.LineChart(document.getElementById('previewTwoYearChart'));
    chart.draw(data, options);
}

Answer 1

从js中删除以下选项

tooltip: { isHtml: true }
isStacked: 'relative'

并在样式表中添加以下css

text {
 font: 8px sans-serif;
 pointer-events: none;
}

希望这个解决方案能够实现

Google Chart Tooltip职位问题

1 个答案: