【问题标题】:How to change colors in Primefaces chart?如何更改 Primefaces 图表中的颜色?
【发布时间】:2012-07-23 12:29:42
【问题描述】:

我有几个问题如何改进这个 Primefaces 图表。

这是源代码:

<h:form>

<p:barChart id="basic" value="#{DashboardController.categoryModel}" legendPosition="ne"  
            title="Accounts and Groups" min="0" max="200" style="height:400px"
            shadow="true" barPadding="60"/>  

</h:form>
import org.primefaces.model.chart.CartesianChartModel;
import org.primefaces.model.chart.ChartSeries;

@Named("DashboardController")
@SessionScoped
public class Dashboard implements Serializable
{

    /*
     * Call the Oracle JDBC Connection driver
     */
    @Resource(name = "jdbc/Oracle")
    private DataSource ds;
    private CartesianChartModel categoryModel;

    public Dashboard()
    {
        createCategoryModel();
    }

    public CartesianChartModel getCategoryModel()
    {
        return categoryModel;
    }

    private void createCategoryModel()
    {
        categoryModel = new CartesianChartModel();

        // Active Accounts

        ChartSeries ActiveAccounts = new ChartSeries();
        ActiveAccounts.setLabel("Active Accounts");

        ActiveAccounts.set("Active Accounts", 120);

        categoryModel.addSeries(ActiveAccounts);

        // Blocked Accounts

        ChartSeries BlockedAccounts = new ChartSeries();
        BlockedAccounts.setLabel("Blocked Accounts");

        BlockedAccounts.set("Blocked Accounts", 120);

        categoryModel.addSeries(BlockedAccounts);

        // Active Groups

        ChartSeries ActiveGroups = new ChartSeries();
        ActiveGroups.setLabel("Active Groups");

        ActiveGroups.set("Active Groups", 120);

        categoryModel.addSeries(ActiveGroups);

        // Blocked Groups

        ChartSeries BlockedGroups = new ChartSeries();
        BlockedGroups.setLabel("Blocked Groups");

        BlockedGroups.set("Blocked Groups", 120);

        categoryModel.addSeries(BlockedGroups);



    }
}

您能告诉我如何更改图表大小的颜色,以及“帐户和组”的颜色吗? 我还想问您如何在每列下方添加名称?现在我只有一个名字“Active Accounts”。我想单独命名列。

祝你好运

P.S 我在 JSF 标头中测试了这段代码,但它不起作用:

<script type="text/css">
        .jqplot-title{
        color:red;
        }
    </script>

P.S 2 只改变了图表的标签

【问题讨论】:

标签: jsf jsf-2 primefaces


【解决方案1】:

使用&lt;p:barChartseriesColors属性

喜欢这个seriesColors="000000, FFFFFF, 2288AA"

关于标题和坐标轴颜色,使用这个:

.jqplot-title{
    color: #FF0000;
}
.jqplot-xaxis-label{
    color: #FF0000; 
}
.jqplot-yaxis-label{
    color: #FF0000;
}

【讨论】:

  • 是的,但这会改变列的颜色,而不是描述文本。
  • 您是否也尝试过新的 jqplot-xaxis-label 和 jqplot-yaxis-label ?因为我在你发布的新代码中看不到它
  • 是的,我添加了代码 - 这是我测试的最新代码:pastebin.com/pkMAwpMX
  • 这会更改底部的标签:.jqplot-xaxis-tick{ color:#FFFFFF; } 但我找不到如何更改jqplot-yaxis-label
猜你喜欢
  • 1970-01-01
  • 2016-11-30
  • 1970-01-01
  • 1970-01-01
  • 2014-01-09
  • 2017-02-11
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多