Question

我正在使用googlecharts生成条形图，我想以不同的颜色显示每个条形图。我尝试在选项中设置“颜色”，但在我的情况下“蓝色”的所有条上只显示一种颜色，但我想显示所有不同的颜色。这是我的代码

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
    <%@ page import="java.sql.*" %> 
    <%@ page import="java.io.*" %>
<!DOCTYPE html>
<html lang="en">
 <head>
        <script type="text/javascript">

            var theData = [ // Start of JavaScript data object
            <%
            Class.forName("oracle.jdbc.OracleDriver").newInstance();
            String connectionURL = "someurl";
            Connection connection = null;
            connection = DriverManager.getConnection(connectionURL);

                PreparedStatement ps = connection.prepareStatement("SELECT order_channel, ROUND(orders / SUM(orders) over () * 100, 2) pct, ROUND(orders) orders FROM ( SELECT order_channel, COUNT(*) AS orders FROM order_channel GROUP BY order_channel ) ORDER BY 3 DESC");
                ResultSet rs = ps.executeQuery();

                while (rs.next()) {
            %>
                    [ "<%= rs.getString(1)%>",<%= rs.getString(2)%>,<%= rs.getString(3)%>],
            <%
                };
                // End of JavaScript object holding the data
            %>
                ];
        </script>

        <script type="text/javascript" src="https://www.google.com/jsapi"></script>
        <script type="text/javascript">
            google.load("visualization", "1", {packages:['corechart', 'bar']});
            google.setOnLoadCallback(drawChart);
           function drawChart() {
                var data = google.visualization.arrayToDataTable([['OrderChannel', 'PCT', 'Orders']].concat(theData), false);

                var options = {
                        title: 'National  Orders',
                        isStacked: true,
                        hAxis: {
                            title: 'Total Count'

                          },
                          vAxis: {
                            title: 'Order Channel'
                          },
                          colors: ['red','blue','green','yellow','pink','magenta','cyan', 'gray','orange','lime']
                       };
                var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
                chart.draw(data, options);
            }
        </script>

    </head>
    <body>
        <div id="chart_div" style="width: 900px; height: 500px;"></div>

    </body>
</html>

googlecharts - 通过设置'colors'选项，条形图的不同颜色不起作用

0 个答案: