如何从谷歌图表中删除规范/符号?

时间:2015-10-07 05:48:56

标签: javascript asp.net-mvc google-visualization

使用google.visualization在MVC 5 Web应用程序中填充图表。

想要从波纹管中删除黑色圆圈符号线 enter image description here

我必须做什么设置? 脚本:

<script type="text/javascript">
    google.setOnLoadCallback(drawChart);

    function drawChart() {
        var rows = new Array();
        var jsonData = '@Html.Raw(@Newtonsoft.Json.JsonConvert.SerializeObject((List<ChartDTO>)Model.Charts.ToList()))';        
        $.each($.parseJSON(jsonData), function () {          
            rows.push([parseInt(this.UserCount)]);
        }); 

        var data = google.visualization.arrayToDataTable([
          ['Month', ''],
          ['Jan', parseInt(rows[0])],
          ['Feb', parseInt(rows[1])],
          ['Mar', parseInt(rows[2])],
          ['Apr', parseInt(rows[3])],
          ['May', parseInt(rows[4])],
          ['Jun', parseInt(rows[5])],
          ['Jul', parseInt(rows[6])],
          ['Aug', parseInt(rows[7])],
          ['Sep', parseInt(rows[8])],
          ['Oct', parseInt(rows[9])],
          ['Nov', parseInt(rows[10])],
          ['Dec', parseInt(rows[11])]
        ]);

        var options = {
            title: 'Traffic',
            vAxis: {title: "Registrations", viewWindow: { min: 0 }},
            curveType: 'function',
            legend: { position: 'bottom' },
            series: { 0: { color: 'red' } },
            hAxis: { title: "Months" },
            'chartArea': { 'width': '80%', 'height': '70%' },
        };
        var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
        chart.draw(data, options);
    }
</script>

1 个答案:

答案 0 :(得分:1)

您可以使用series0.chart-line-symbol { -fx-background-color: green; -fx-background-insets: 0; -fx-background-radius: 0px; -fx-padding: 5px; } 作为位置来停用图例:

'none'

示例

legend: {position: 'none'}
google.load('visualization', '1', { packages: ['corechart', 'line'] });
google.setOnLoadCallback(drawBasic);

function drawBasic() {

    var rows = new Array();
    for (var i = 0; i < 12; i++) {
        rows.push(getRandomInt(0, 100));
    }


    var data = google.visualization.arrayToDataTable([
         ['Month', ''],
         ['Jan', parseInt(rows[0])],
         ['Feb', parseInt(rows[1])],
         ['Mar', parseInt(rows[2])],
         ['Apr', parseInt(rows[3])],
         ['May', parseInt(rows[4])],
         ['Jun', parseInt(rows[5])],
         ['Jul', parseInt(rows[6])],
         ['Aug', parseInt(rows[7])],
         ['Sep', parseInt(rows[8])],
         ['Oct', parseInt(rows[9])],
         ['Nov', parseInt(rows[10])],
         ['Dec', parseInt(rows[11])]
    ]);

    var options = {
        title: 'Traffic',
        vAxis: { title: "Registrations", viewWindow: { min: 0 } },
        curveType: 'function',
        legend: { position: 'none' },
        series: { 0: { color: 'red' } },
        hAxis: { title: "Months" },
        'chartArea': { 'width': '80%', 'height': '70%' },
    };
    var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
    chart.draw(data, options);

    
}


function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}