on 10-26-2016 1:20 PM
HI experts,
Need help on color coding for Colum combination chart.
I have Jan to dec in X-axis. and i have yearmonth variable
whenever user selected in variable color should change dynamically for example if he selected May 2015 .so till Apr 2015 bars should be black and remaining bars should be in blue
black bar-Actual
blue bar-Target
Please find the image
I Have tried by capturing variable and apply css.but no luck and i reffered blogs as well but not full filled my requirement
any help would really appreciated.
https://blogs.sap.com/2014/09/19/learn-about-arrays-in-design-studio-13/
https://archive.sap.com/discussions/thread/3759486
https://archive.sap.com/discussions/thread/3701365
var month = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
var a = PAPLS_OVERVIEW.getVariableValueText("PA_V_A_MM_YYYY");
var monthNum = Convert.stringToInt(a.substring(0,3));
CSS:
COL1 g.v-m-main g.v-m-plot g.v-column:nth-child(1) .v-datapoint.v-morphable-datapoint {fill: red!important; stroke: #E20015;}
HI Boopalan,
Thanks for your reply. May i know why used return here?
shall i use setcssclass or return.here?
i am just confused . i never explored on this .could you please explain in detail please?
and i Didnt find formatter function any where in my chart.could you please guide me on this
My requirement
1. if user selected May so till may color of bars should be back(actuals) and from june to december blue(target)
Thanks,
Varun
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Hi Varun,
Sorry for the delayed reply i didn't get any notification on your comment.
The return function assigns value to the CSS class property dynamically.
It's like instead of giving a class name to the property, we can use this method to assign different classes in our css file based on our requirement. Like yours to change color at run time.
As in my scripting, based on month selected the css class will be assigned the chart. Here the return function sends string(class name) as value of the CSS class name property.
Let me know if more clarification needed.
Thanks,
Poovarasan
Hi varun,
You cannot pass variables to css. But you can write logic in Formatter Function and use it to change the CSS class for your chart dynamically in Design studio versions 1.5 and above.
Let us consider your CSS file have classes like
.month1 .(css class for bar coloring)
{Code to color first bar bar}
.month2 .(css class for bar coloring)
{Code to color bar}
.month2 .(css class for bar coloring)
{Code to color second bar bar}
note: classes are same as you used to color bars in your chart
you can write formatter function in data binding of CSS class as
var selected_month = "User selected month";
if (selected_month = 1)
{
return("month1");
}
if (selected_month = 2)
{
return("month2");
}
So your css class name will change according to the selection of month. For data cell binding you can use any data as we are not going to use in formatter function.
I think it will solve your problem.
Thanks,
Poovarasan
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
The closest, easiest way is to check page 73 of this document: https://visualbi.com/wp-content/uploads/visualbi-extensions-for-sap-businessobjects-design-studio-vb... - not sure if it meets your requirement.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
User | Count |
---|---|
90 | |
10 | |
10 | |
10 | |
7 | |
7 | |
6 | |
5 | |
4 | |
3 |
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.