$(function () { pageContext.i18n.modTalk = 'moderation talk'; pageContext.i18n.replyToComment = 'Reply'; pageContext.i18n.modTalkEmpty = 'moderation talk is empty'; pageContext.url.getModTalk = "/comments/%25ID%25/listModTalk.json"; pageContext.url.possibleCommentRecipients = "/comments/%ID%/possibleRecipients.json"; pageContext.url.commentEdit = '/comments/%25ID%25/edit.html'; pageContext.url.commentView = '/comments/%ID%/view.html'; pageContext.i18n.commentVisibility = { 'full': 'Viewable by all users', 'op': 'Viewable by the original poster', 'mod': 'Viewable by moderators', 'opAndMod': 'Viewable by moderators and the original poster', 'other': 'Advanced visibility', 'dialogTitle': 'Comment visibility', 'selectGroups': 'Visible to groups', 'selectOther': 'Other recipients', 'selectOriginalPoster': 'Original poster', 'selectModerators': 'Moderators', 'selectAssignees': 'Asked to answer users' }; pageContext.i18n.commentMenuLabels = { 'comment-edit': 'comments.menu.edit', 'comment-delete': 'comments.menu.delete', 'comment-convert': 'comments.menu.convert' };pageContext.i18n.answer= { bestAnswer: 'Best Answer', controlBar : { accept: 'Accept', unaccept: 'Unaccept', acceptCommand: 'Accept this answer as correct', cancelAcceptedCommand: 'Remove this answers accepted status' } }; window.croles = { u: false, op: false, m: false, og: false, as: false, ag: false, dc: false, doc: false, eo: false, ea: false }; tools.init({ q: { e: false, ew: false, eo: false, r: false, ro: false, d: false, dow: false, fv: false, c: false, co: false, p: false, tm: false , ms: false, mos: false }, n: { f: false, vf: false, vfo: false, vr: false, vro: false, c: false, co: false, vu: false, vd: false, w: false, wo: false, l: false }, c: { e: false, eo: false, d: false, dow: false, ta: false, tao: false, l: false }, a: { e: false, ew: false, eo: false, d: false, dow: false, a: false, aoq: false, ao: false, tc: false, tco: false, p: false, tm: false }, pc: croles }, { tc: true, nsc: true }); commandUtils.initializeLabels(); }); Skip to Content

How to hide chart type picker options in SAP BO design studio version 16.0.5?

cuserssrijh001capture.png

I am using "Chart type Picker" component to display different chart types. Currently I am using below css to hide chart types ( which is showing first 3 chart types , bar/column , line and pie charts) but I want to hide chart types within bar column chart, or lets say I want to hide donut chart which is part of pie chart. Can someone please suggest how can I achieve that. I have attached screen shot

.viz-controls-switchbar-switcher{
display:none;
}
.viz-controls-switchbar-switcher:nth-child(-n+3) {
display:block ;
}

Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

5 Answers

  • Mar 01, 2017 at 11:05 AM

    Hi Shalu,

    Have you referred to the techniques and discussion in the following blog post?: CSS Tips & Tricks: Customizing the ChartTypePicker

    Add comment
    10|10000 characters needed characters exceeded

  • Mar 01, 2017 at 10:17 AM

    Hello Shalu - have you tried debugging the CSS to see what could possibly be removed? See https://blogs.sap.com/2014/05/11/how-to-find-and-change-the-css-class-design-studio/ for steps

    Add comment
    10|10000 characters needed characters exceeded

  • Mar 03, 2017 at 04:57 PM

    Thanks Mustafa, I had followed the link you posted .

    As I have mentioned about css in my question, I am able to hide chart types from the chart picker component but I am not able to hide the chart types within chart types. For example, I am not able to hide the "Donut chart type" which is within the pie chart type.

    I am using below css to hide ( this is displaying first 3 chart types in chart picker):

    .viz-controls-switchbar-switcher{
    display:none;
    }
    .viz-controls-switchbar-switcher:nth-child(-n+3) {
    display:block ;
    }

    Can you please help me on this - how to hide chart types with in chart types ?

    Add comment
    10|10000 characters needed characters exceeded

  • Mar 06, 2017 at 07:24 PM

    Do we have any update on this post ?

    Add comment
    10|10000 characters needed characters exceeded

  • Jul 16 at 08:02 AM

    It doesn't feel good reviving a year old discussion, but I want to share what I found on this matter.

    Somehow I also encounter with this issue and after looking around, I think it's not possible to hide the inner chart type from Chart Type Picker.

    Basically, the css class viz-controls-switchbar-dropDownList only appears one-at-a-time when we click on the group and have generic class so there is no way to discern between groups (Bar & Column, Line, Pie, etc) using nth-child. So even if we intend to select a chart to hide by the nth-child member, it would be valid for all groups, which should not be the intended behavior. It crossed my mind to select the element based on its inner html, but unfortunately it's not possible unless using jquery.

    The only workaround I could think of is to utilize the additional types, add all chart types we want to use and hide all standard chart group. That or somehow make SAP do something.

    If anyone could get a better solution, please do enlighten us.

    Add comment
    10|10000 characters needed characters exceeded