Skip to Content

Analysis Chart Formatting for Design Studio

Hi everyone,

I'm trying to reach a specific thing on Design Studio. I want to be able to edit a datasource on Analysis add-in so that the first two columns have a special color than others,like in the picture below. Is there a way to do that in Analysis OR in Design Studio without using scripts?

Best regards,

Ozan

--

Design Studio version 1.6 or 1.5

Analysis version 2.3

c67bo.png (44.6 kB)
Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

7 Answers

  • Feb 10, 2017 at 11:33 AM

    You could try using CSS inside Design Studio - see https://blogs.sap.com/2014/05/11/how-to-find-and-change-the-css-class-design-studio/ - assuming the first bars are static. Are you using the CHART component or the INFOCHART?

    Add comment
    10|10000 characters needed characters exceeded

  • Feb 10, 2017 at 01:50 PM

    Hi Tammy,

    Thank you for your quick answer, I've been reading your posts for some time. I know this approach and tried it before. I'm wondering if it's possible to transfer formatting done to chart in the Analysis OR BW/BEx Query Designer to Design Studio side.

    INFOCHART/CHART, this is intended for future use so I may use both.

    Best,

    Ozan

    Add comment
    10|10000 characters needed characters exceeded

  • Feb 10, 2017 at 02:21 PM

    Using the Smart Copy/Paste, Analysis Office appears to just copy the data source, not the cell highlights/styles

    I think you are better off accomplishing this using CSS https://archive.sap.com/discussions/thread/3965481

    Add comment
    10|10000 characters needed characters exceeded

  • Feb 13, 2017 at 11:34 AM

    Hi Tammy,

    Thank you for your answer. As you mention I saw that smart paste doesn't copy styles. I tried to use Mustafa Bensan's CSS approach and it worked as it did in the past.

    I noticed that all columns of DE is blue after the CSS, the thing I'm looking for is just a one step away. I only want the first column in blue as below.

    In order to do that I need to be able to select only the first column in CSS. I find that all originally red columns have everything same but their data-id and data-datapoint-id numbers highlighted in green above. I'm trying to select only the column with data-id = 0 and data-datapoint-id = 1 but couldn't succeed yet.

    Does anyone know how to only select the first column?

    Best regards,

    Ozan

    Add comment
    10|10000 characters needed characters exceeded

  • Feb 15, 2017 at 02:18 PM

    Tammy, agreed.

    Nikolaus Weiss, thank you for your answer. Code below didn't work in my case.

    g[data-id="0"][data-datapoint-id="1"] {
       css here;
    }
    Add comment
    10|10000 characters needed characters exceeded

  • Feb 15, 2017 at 02:36 PM

    Nikolaus and Tammy,

    You can follow the new question here.

    Best regards,

    Ozan

    Add comment
    10|10000 characters needed characters exceeded

  • avatar image
    Former Member
    Nov 14, 2017 at 01:59 PM

    .chartColumn1 g.v-m-main g.v-m-plot g.v-plot-main g.v-datapoint-group .v-datapoint:nth-child(2) rect { fill: #800040!important; }

    .chartColumn1 g.v-m-main g.v-m-plot g.v-plot-main g.v-datapoint-group .v-datapoint:nth-child(3) rect { fill: #0000ff; }

    Try with the above CSS

    Add comment
    10|10000 characters needed characters exceeded