Skip to Content

SCN Design Studio SDK Development Community

3.0 Information (new for Design Studio 1.6)


SCN Design Studio 1.6 SDK Components (ver 3.0)


Summary of Components


Component List – SCN Design Studio Community


Component Documentation


SDK Development Community Git Repository (list & documentation)


Component List (A must see!)

Component List – SCN Design Studio Community




Just over one year ago, SAP released an SDK to us beginning with Design Studio 1.2.  Time flies, and we’ve had two releases since then and currently are now up to 1.4 with many new features available.


As many know I’ve publicly shared many of my components to SCN via blog posts referencing open source code on GitHub.  It began mostly with blogs on how the components were written, and then my approach shifted to more of a use case followed by a ready-to-install version (with source code available for fellow coders.)  Karol Kalisz from SAP also began actively contributing over this past year along with a few from Jeroen van der A, leandro cardoso, Nicholas Stein, and David Richardson.


There’s probably little debate that Karol Kalisz and myself have been the most active and at times have even overlapped on contributions to the community.  (Example: SDK components – development direction & conceptsDirk Mayrock also stepped up to try to help curate a list of these components from various open source (and commercial) contributors.


With the many different (and sometimes similar) components we’ve made available , Karol and I thought there was room to improve and organize.  We’ve had good discussions over a number of threads recently where Karol and I decided to explore the option of creating a unified community package that we could both contribute and collaborate on together instead of working in isolation.




Karol and I are joining efforts for Design Studio SDK development for open source community-based components.  SCN is the logical place to announce this and continue to share new contributions.


As of today, our voluntary members are:


Mike Howles


  • BI Solution Architect at International Paper, an SAP Customer.
  • SAP Mentor
Karol Kalisz

  • SAP Employee
  • Active SCN participant and open source contributor

Franck Blais


Manfred Schwarz


  • Experienced in Design Studio SDK and Lumira vizPacker

Martin Pankraz


  • BI and software architect at ConVista Consulting

James Rapp


  • SAP Employee (SAP Labs)
  • Solution Adoption Specialist

Mustafa Bensan


Jeroen van der A


  • New SCN SDK Community contributor, but long-time Design Studio SDKer
  • Works at Blog – Interdobs

Donnie Burhan


  • Our newest contributor!


Why are we doing this?


  • We see potential in sharing development techniques and common code together.
  • We want to have a set of components and source code that are not competing or overlapping with one another.
  • Provide more consistency to our (at times brave) community of designers who are using our SDK components.


Our Main Goals


  • Continue to share SDK Source Code examples (and their ready-to-install versions) with the SCN Community.
  • Engage additional SDK developers (new and “old”) to contribute.
  • Engage people who may not be SDK developers, but have great ideas and use case requirements.
  • Improve and standardize delivery and communication of new components and a way to track issues and new ideas.


What will change for SDK Developers who are interested in participating?


  • All SDK extensions will be made available in a common repository which is owned by the community.
  • With a common, centralized repository, better support (always on a voluntary basis, mind you) will be possible.
  • Basic but limited support approach for isolating 1.4 extensions from 1.3 extensions where feasible, so to not cut off those who cannot immediately move to 1.4 but would like to start moving to this new repository.


What will change for Design Studio Designers who have used existing SDK Extension Releases?


Karol and I have no plans to remove our old repositories as long as GitHub and webhosts used are available.  These primarily are:



While you can choose to use these existing packages as-is, we have no plans to fix any issues or enhance them further and we highly recommend you begin shifting over to the newer centralized repository that will receive all future enhancements and fixes.


What is this new approach?


We will provide one centralized repository, but with two different states of development you can choose to work with:


  • preview
    Preview builds are similar to what other development communities may call nightly or experimental builds.  In our case, probably not nightly, but whenever we have something we’d like to share in a usable however not fully-baked form.
  • stable
    Stable builds are created when we (SDK developer community) are happy enough with the content and feel it could survive in the wild (Design Studio Designers)


Where can I see the Source Code?


The SDK code can be viewed, forked, and downloaded as a .ZIP of Eclipse projects from GitHub at this URL:


org-scn-design-studio-community/sdkpackage · GitHub


I am not a coder, how can I just install the Ready-to-Use version?


As some know, there are two approaches to installing SDK Extensions.  The approach that works for you is based on your workplace environment and design approaches.


  • “Offline” .ZIP Archive Method
    You can choose to download a .ZIP archive version.  The advantage is that once you obtain the software in archive form, you can then distribute to a broader designer team at your workplace and you do not have to worry with corporate firewall issues once you have it downloaded once.  The disadvantage is that you now must manually pull down future versions and distribute ongoing.
  • “Online” Repository Method
    You choose can install the SDK Extension via URL as well.  The advantage is that pulling down new updates is very streamlined and can be done within the Design Studio tool itself.  The drawback is that if you have an aggressive corporate firewall this may not be an option, and if you want stricter controls on which last version of the SDK Extension you are using, the online method may not be the best fit.

With that definition, here are the links to the “Offline” Archives and “Online” Repositories.




Once you have followed one of the 2 method’s paths above, the remaining steps are the same.  You will be presented with a dialog box asking you which SDK Extension Features you’d like to install.  As mentioned earlier, we’ve made an effort to isolate 1.4 extensions from 1.3 extensions for the time being.  That’s not to say that some components packaged in 1.3 may not behave differently in Design Studio 1.4, so proceed with this in mind, but the 1.3 option will install in DS 1.3 and both can and should be installed in DS 1.4.



Check mark the relevant Extension features and continue.  (DS 1.3 users should only select the 1.3 option)


After finishing the installation wizard, you will be prompted to restart Design Studio at which point you can then begin to use our components!


What all is Included?


Karol’s intent is to port over most if not all of his existing components.  I’ve opted to let some of my experimental/exotic components die off and will not be porting them all over since the intent in this repository are mostly usable components and I’d like to avoid cluttering it with my lab experiments.  Perhaps Karol and/or I will isolate these as their own check box feature in the future for those brave enough to be guinea pigs.


Support Expectations

Developer participation is purely voluntary and there’s no support obligation from participants to provide maintenance, even from SAP.


I’d Like to Join the Effort!


Great!  Put a comment below and Karol or I will respond with more detail, if not a separate more technical discussion post/document with more information.


Update: Technical details now provided: SDK Development Community Git Repository (sdkpackage)


Questions, Comments, Problems?


Please comment below and we will try to help where we can and this post will be kept up-to-date with the latest information as things progress.

You must be Logged on to comment or reply to a post.
  • Hi Mike and Karol,

    We have developed several CVOM extensions (Luimira SDK) based on D3.js graph library and I think that it would be useful to re-develop them again as a Design Studio Extensions in order to workaround some issues we have (see on Lumira Visualization: How to manage data binding when using flat tables data?.) Do you think that issue described there managing flat table datasets could be workarounded using Design Studio SDK?

    If yes, I think we have enough Java/JS/CSS skills to afford the challenge but in order to re-invent the weel question would be: Could you recommend us some open-source DS extension (also based on D3) which source code we can "effectively" use as a model/template to follow in our task?

    Thanks for your patient and devotion!


  • Hello Experts,

    We installed the SDK pack earlier in an existing BO server . However the box had to be cleaned up due to complications . After rebuilding the Server I am trying to reinstall the components but I am unable to do that .

    Whenever I am trying to do that it's showing the components are already installed . But it is not showing in platform extensions .

    Kindly advise.

  • Hello Experts,

    first of all thanks alot for your great work on this!

    Most of the things we tried out with this package works very good but with the latest version there is a problem. The CLIENTINFORMATION is now a technical component but when we use it it covers over the whole application. That makes Buttons unuseable. Is there a way to work around this?

    Thanks in Advance!

    Best Regards
    Dominik Herrmann

    • I assume you are in M mode and not classic mode?  M mode has many bugs that I have seen, this is one of them.  I hope SP1 due soon corrects it. Can you confirm you are in M mode?  Going back to Classic mode should fix.

      • Thanks for your answer!

        I checked that but it is not the m mode. I even tried to migrate the application to that but the CLIENTINFORMATION blocks it.

        It is a prototype that i built from Karols Blog on how to create responsive applications with SCN components and is not compatible with the m mode. I confirmed this error in a simple application where i only had a button and the technical component Clientinformation. The Button was unclickable.

        Looking at the created HTML DesignStudio seems to create containers for techincal components that actually have size 100% for width and height. If i set this to 0px with css it works but this solution is very sloppy and not dynamic.

        Just to confirm this i am talking about the version 3 of the SCN extensions.

        Best Regards

        • Strange, I only had that happen tool me in M mode.  This afternoon I can test and revert it if needed. Sorry about this if it's a bug on our end!

  • Hi Mike,

    We are trying to move some of our dashboards from classical to m mode, but I have found an issue on Fioiri ToolBar (m-mode). It does not show any button, only 3 small dots at the rgith margin. I am using DS 1.6 and I have downloaded latest stable release of components by today./wp-content/uploads/2016/01/issue2_874804.jpg

    Might be a bug?

  • Hello Mike

    Thank you for the SDK version 3.0

    I am using the component "Postresponseparser"  which works very well in version 2.0.

    But When I upgrade to SDK version 3.0. I found that some of API cannot find.

    Ex: I can use the function  "add parameter"  in version 2.0 but I cannot found in  "Postresponseparser 2.0" in version 3.0.  Is there anything I miss?

    Thank you very much for the really useful component.


  • Hi Mike,

    I'd like to get involved with developing some content for this (and at the same time ramp my JAVA knowledge up.  Is it possible that you could send me a direct communication in this regard?

  • Custom extensions: Anyone interested in my personal list of useful D3.js resources?

    Hi all!

    I´m not quite sure if it is really helpful to You guys. Maybe it´s a bit off-topic. So before

    I start writing a blog or a paper, just let me explain and ask a question:

    Since the dawn of DesignStudio I was allways fascinated by the idea of creating my

    own extentions. First thing I learned: It´s possible, the possibilities are nearly endless,

    but You have to learn a fair amount of D3.js before You can use Your very own extentions

    with DS. Comming for the business side of things and beeing an absolute rookie in

    JavaScript and D3 I had to start from zero. Now I´m somewhere between 0.1 and 0.2 😉

    I gathered a lot of information from Websites, Blogs, Tutorials, Ebooks

    an printed ones during the last few months and I´m still climbing up the steep learning curve.

    Just give me a shout, if You are interested in what I found useful to start with D3.js.



  • Hello Mike -

    We are planning to use couple of SDK components developed by community.  Can you please guide us on how we can extract only required components from the list

  • Hello Mike,

    I'm trying to import the offline tools, after saving the zip file and using the "Archive..." button, and I'm receiving an error message "Discovery completed without finding any extensions. Please check your network connection and try again". I tried with the online version and I can imported it but our firewall cuts the connection, so I have to use the offline.

    Is there any issue with this zip file? Do I need to change the steps to import it?

    Thank you in advance.



  • After Upgrade to DS 1.6 SP2 our dashboards using SCN components (BulletMicroChart + JSON Object) are not displayed anymore. If we open the dashboard in Designer an empty canvas is shown, no error message. Also in Browser just an empty screen shows up.

    Is the SDK Package not yet ready for SP2?

  • Hey guys, awesome project. I'm currently experimentig with the planning calendar. Is it possible to add the week for the view? I tried to add it somehow, but i can only get it to the property dropdown and then it throws errors. I cannot find the coing for the selection.  Any help is appreciated.

  • Hi, I've been looking around and Reading about the SDK and for my life that I couldn't find any reference to any license terms. I'm planning on installing these components on my company's BI server but before doing so I wanted to be sure I coud use them for our business (profitable), so I'll ask it here, are these components offered under some kind of license that allows its free use? (I'm thinking GPL or something).

    Thanks for your answer and the great work your doing!


  • Hi,Mike,My bi platform is BO 4.1 sp5. After I installed Design studio 1.6 ,the webi reports become slow,and the rhythm is almost 5-10 minutes  alternately, fast ,slow, fast ,slow...
    Each time I restart the server (windows 2012), the BO speed  recover the normal circumstance.But almost one day later ,the slow rhythm is back.Could you know the reason?Thank you.

    • Hi Jassy,

      Unfortunately this is a question you need to discuiss with SAP support. In addition to that your question is off-topic for this blog post. Please follow the rules of

      Kind regards

  • /
    • Hi Kumar,

      We are also trying to recollect all our content and fix broken links as we go. You can try to open a feature request on our GitHub page to get what you want for the calendar component. Of course you are always free to copy our code and extend it yourself. It is definitely possible to add coding to assign a datasource containing dates and applying special styling for them on the component from a UI5 perspective.

      Kind regards

  • Hi,

    I have added the components in my design studio. I  have published  the same  in the BO repository. In my local  mode  the  component(Gauges) work fine but from the BO launchpad the  Analysis application  does not work.  Should i do something at the platform  level  ?
    What is the use  of "Platform" extensions?

  • Hi,
    I've problem with component "PDF Print 2.0". I need PDF export of one panel in landscape mode. In original 3.0 release of SCN DS SDK it works great in the local mode but failed to export in on BI platform (prints in portrait mode and ignores setup of component). Now in updated productive version of SCN SDK (also in experimental build) it failes to print in landscape mode in both local and BI platform. This component is very important for me and I'd like to use it on productive system. But with limitation to portrait mode export I can't... Could you please help me?


    DS Report:

    PDF export:

  • Hi,

    My DS version is 1.6 sp2. I have a problem with KPI tile 2.0. I downloaded the SDK Package Ver 3.0 and tried using the KPI tile. I dont see the data binding Property for KPI tile. Is i a bug or am I missing something?


  • Dear community,

    Is there a component available in DesignStudio that behaves like a Slicer COmponent in MS Excel? The purpose is to filter the data in other components:

    List with available Items:

    Selected Items (filter in example is Japan) the unselected items remain visible; no checkboxes, no dropdownlist...:

    Any idea if this exists as an extension?

  • Dear community

    Could you tell me how to filter on selected values of the enhanced checkbox group component ?

    Following script  DS_1.setFilter(“XXX”, CHECKBOXGROUP_1.getElementSelectedKeysArray()) is not correct.



  • Hi Experts,

    Trying to develop custom charts component for Design Studio for my company. Everything is OK, except sizing the component. Everytime I start to build my component as raw html, and then move it to the Design Studio. But I have sizing issue that is in my html design; I can create my chart using d3, jquery and third-party libraries by using bootstrap responsive design, it works well as html page. But when I move it to the design studio, and use it with the grid layout, cells break down my whole responsiveness. Don't know how to fix it, I'm trying to fix this problem for three days and don't know how. If you want to help me, I can share my code with you.


    • Component resizing with D3 is tricky.  You'd need to attach a window.setInterval poller to inspect a given DIV that houses your D3 SVG/Canvas object and see if the width/height has changed and then destroy/redraw it on change.  This is because SVG objects do not accept %-based width and heights.  Hope this makes sense.

      • Hi Mike,

        First, thanks for the answer.

        I am using the way that u described. Get the container div's height and width, and draw viewbox of component with these sizes. It works but I consider if there is better way, beacuse when I look custom components's code that was developed by SAP, there is no trick like this but they works responsively.


  • The ColumnMicroChart UI5 component within KPITILE might have an issue. I created a KPITILE and set the full spec to the following:

    <ColumnMicroChart size="M" press="press" class="sapUiSmallMargin">
    <ColumnMicroChartData value="100" color="Error"/>
    <ColumnMicroChartData value="60" color="Neutral"/>


    The component type is set to ColumnMicroChart.

    I get the following error when executing the dashboard:

    A JavaScript error occurred. "Element sap.suite.ui.microchart.ColumnMicroChartData#KPITILE_4_controlColumnMicroChartData0.18406259251410462" is not valid for aggregation "columns" of Element sap.suite.ui.commons.ColumnMicroChart#__chart3 Error: "Element sap.suite.ui.microchart.ColumnMicroChartData#KPITILE_4_controlColumnMicroChartData0.18406259251410462" is not valid for aggregation "columns" of Element sap.suite.ui.commons.ColumnMicroChart#__chart3 at h.prototype.validateAggregation (http://localhost:63730/aad/resources/~20161202172131~/sap-ui-m-zen.js:331:10377) at h.prototype.addAggregation (http://localhost:63730/aad/resources/~20161202172131~/sap-ui-m-zen.js:331:11644) at Anonymous function (http://localhost:63730/aad/resources/~20161202172131~/sap-ui-m-zen.js:333:3577) at n (http://localhost:63730/aad/resources/~20161202172131~/sap-ui-m-zen.js:331:4095) at h.prototype.applySettings (http://localhost:63730/aad/resources/~20161202172131~/sap-ui-m-zen.js:331:5623) at Anonymous function (http://localhost:63730/aad/resources/~20161202172131~/sap-ui-m-zen.js:331:2797) at constructor (http://localhost:63730/aad/resources/~20161202172131~/sap-ui-m-zen.js:331:2676) at constructor (http://localhost:63730/aad/resources/~20161202172131~/sap-ui-m-zen.js:357:921) at constructor (http://localhost:63730/aad/resources/~20161202172131~/sap-ui-m-zen.js:349:850) at f (http://localhost:63730/aad/resources/~20161202172131~/sap-ui-m-zen.js:335:3320)


    Is it the component or just me?

  • Hi

    I installed the latest offline stable version for design studio 1.6.

    Everything working great when I'm working locally , but when I'm running the dashboard on BI platform I'm getting an error message that the new item cannot be created.

    Am I missing something ?

  • Hi,

    On my Design Studio 1.6 SP03 patch 1 Tool (32 bits) I have installed

    extension plugin.

    New components are shown but When I try to use them an error arises:

    !ENTRY 4 0 2017-06-08 15:09:00.019

    !MESSAGE Failed to load MIME object 'sdk_include/'

    What I did wrong?.

    Thanks in advance,


    • Hi, you need always to install all plugins as some are created for code reuse. just install also the "" plugin and this issue will be gone.

  • Hi Everyone,


    Thanks for SDK components they are great but I'm facing issue with 4 components KPI Tile 2.0, KPI Tile 2.0 View,Date Scroller and Date Slider.

    I have installed package:

    Design Studio 1.6 SP00

    Eg: While I'm dragging component to canvas


    Error: A problem occurred while parsing a Design Studio Extension XML (path "contribution.xml" of extension "com.sample.utilities", line 340, column 77): The include <jsInclude>res/js/noty/packaged/jquery.noty.packaged.min.js</jsInclude> is most likely not allowed, as it could conflict with a builtin JS file.

    Error: Could not bind a reference of component The reference is: Reference[name = IActivatorBase, interface =, policy = dynamic, cardinality = 0..n, target = null, bind = addRICActivator, unbind = removeRICActivator]


    Ravi Bodala

  • Hi Everyone,

    Thank you for your efforts to keep the post updated.

    I downloaded the code for version 3.0 from the link from the post . While unzipping, I get the below error. If I press enter, similar error pops up for another file. If I keep pressing enter till the end and add the projects in eclipse, some of the .js files (eg. PropertyPage.js) are missing from the projects (last pic below). Due to this the components are not rendering.

    Have you seen these errors before? Could you help to resolve this?







  • Mike Howles Hi there, I wanted to check with you whether these SDK Components are still being maintained?  Reason why I am asking is because we are having some technical issues with the KPI Tiles.

    We are using Design Studio 1.6 SP3, when I add KPI Tiles to my canvas and execute the application, everything shows apart from the KPI Tiles.  They don't seem to show, regardless of what we do.  Visibility is set to "True" as well.

    It is kinda sad that KPI Tiles are not default components included within SAP Design Studio.

  • Hi All,

    We are using "Open Url inplace" for our Design Studio Application. Our BO Platform is on AIX. But we got error 2 errors below when we execute the application on platform.


    • "ITEM" of type "ORG_SCN_COMMUNITY_UTILS_OPENURLINPLACE" could not be generated
    • Web Item OPENURLINPLACE_1 could not be found in current Web Application


    Do you know that if this SDK is only available for Windows? Could you help us with this issue?


    Thank you in advance.