想在我的折线图中添加自定义工具提示(工具提示会有一些html内容,如按钮和一些文字)

时间:2014-06-18 08:43:12

标签: javascript charts google-visualization

我通过将数据表作为来自其他页面的响应来填充图表。 所以我在另一边创建json对象并转移到请求站点,他们解析对象并创建数据表并填充图表。

 var jsonData = $.ajax({
                type: "post",
                url: "getHourDrillChart.php",
                data: $("#my_form").serialize(),
                dataType: "json",
                async: false
            }).responseText;

        var obj = jQuery.parseJSON(jsonData);           //alert(""+obj.toSource()); 
        var dataHour = google.visualization.arrayToDataTable(obj);\

            chart.setDataTable(dataHour);
    chart.setOptions(options);
    chart.draw(); 

我创建图表数据的其他网站:

$data[0] = array('Hour',$user); 
                     $getTownLocalityInfo = mysql_query($SQLString); 

    # set heading   
        //$data[0] = array('hour','Count');     
        $i=1;
        $dayArray = array();
        while( $row = mysql_fetch_assoc($getTownLocalityInfo)){
                $date = $row['date'];
                $hour = $row['day_hours'];
                $count = (int) $row['sumCount'];
                $dayArray[] = $hour;

                mysql_query("INSERT INTO trend_hour_chart_temp(hour,$user,userId) VALUES ('$hour',$count,'$staffId')");
                $data[$i] = array($hour , $count);
                $i++;
            }
        echo json_encode($data);

1 个答案:

答案 0 :(得分:0)

您需要向DataTable添加工具提示列。首先将工具提示列添加到列标题中:

$data[0] = array('Hour', $user, array('type' => 'string', 'role' => 'tooltip'));

然后,在while循环中,将工具提示数据添加到您的行中:

$data[$i] = array($hour , $count, 'tooltip string');