jQWidgets Forums

jQuery UI Widgets Forums Chart Black border for stacks when custom colors are set

This topic contains 2 replies, has 2 voices, and was last updated by  suryaprakasd 10 years, 4 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author

  • suryaprakasd
    Participant

    Hi,

    I am using JQXWidgets Stacked Column chart in our project. With default color scheme it is working fine, but when i set a custom color for stacks, it is showing black borders for the stacks. Is there a way to rid of the black border for stacks?

    The following is the JSON setting supplied to JQX chart.

    {“title”:””,”description”:””,”enableAnimations”:true,”showLegend”:true,”showBorderLine”:false,”padding”:{“left”:5,”top”:5,”right”:5,”bottom”:5},”xAxis”:{“dataField”:”legendname”,”type”:”basic”,”showTickMarks”:true,”tickMarksInterval”:1,”tickMarksColor”:”#888888″,”showGridLines”:false,”unitInterval”:1,”gridLinesInterval”:1,”gridLinesColor”:”#888888″,”axisSize”:”auto”},”seriesGroups”:[{“type”:”stackedcolumn”,”columnsGapPercent”:100,”seriesGapPercent”:5,”valueAxis”:{“displayValueAxis”:true,”description”:”Number of Incidents”,”tickMarksColor”:”#888888″},”series”:[{“dataField”:”High”,”displayText”:”High”,”color”:”#D33B39″},{“dataField”:”Low”,”displayText”:”Low”,”color”:”#1076F4″},{“dataField”:”Medium”,”displayText”:”Medium”,”color”:”#D59724″}]}],”source”:[{“legendname”:”12/08/2014″,”High”:”0″,”Low”:”21″,”Medium”:”0″},{“legendname”:”12/09/2014″,”High”:”10″,”Low”:”21″,”Medium”:”0″}]}

    Thanks in Advance,
    Prakash


    Dimitar
    Participant

    Hello Prakash,

    You should also set the line colour (lineColor property) to correspond to the column colour:

    "series": [{
        "dataField": "High",
        "displayText": "High",
        "fillColor": "#D33B39",
        "lineColor": "#D33B39"
    }, {
        "dataField": "Low",
        "displayText": "Low",
        "fillColor": "#1076F4",
        "lineColor": "#1076F4"
    }, {
        "dataField": "Medium",
        "displayText": "Medium",
        "fillColor": "#D59724",
        "lineColor": "#D59724"
    }]

    On a side note, use fillColor instead of color, which is a deprecated property.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/


    suryaprakasd
    Participant

    Hello Dimitar,

    Excellent,
    Your solution, solved my problem.Thanks alot.

    Regards,
    Prakash

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.