Formatting Charts

[Former Member]

Hi all

I have read a lot of posts and blogs now, and I am struggling to see how to format charts beyond the basic properties in the Design Studio user interface. Clearly we need to use CSS, but I am struggling to see how we identify the elements of a chart to apply the CSS to.

I have seen posts that suggest using the F12 developer tools in IE and I am doing that, but what I am seeing does not relate to the posts in this forum.

Please, please please could someone give me some instructions?  SAP seems to provided zero instructions so far.

I have a custom style sheet that I am using to apply styles to text boxes, list boxes, etc so far. How do I identify the elements of a chart?

Thanks

Al.

[Former Member]

The following is an example of hitting F12 in IE after executing a Design Studio app. How would you work out how to identify the legend, to be able to define the font?

Or even the colour? Someone in a post said:

          .chart1 g.v-m-legend g.v-label.viz-legend-valueLabel g.v-row path {fill: green;}

Why does that start 'g.v-m-legend' and not something higher up the chain?

Why was 'v-content' not included, or 'v-groups'?

(and many more questions.)

Any ideas please?

Thanks

Al.

[TammyPowlas]

On the right side there should be a menu "Style" "Trace Styles"

"Trace Styles" should show the CSS class you want to modify, and then you put those changes in the custom.css file in your repository folder.

Note I am really learning this myself as I go.

[TammyPowlas]

Al - have you seen the CSS threads by

like this one?

It sounds like you are on the right path with the F12 in IE

[Former Member]

Yes, thanks. I have seen that thread and the ones within. They do not describe the process of identifying the chart (or other component) elements to apply the CSS.