Skip to Content
Author's profile photo Hari Srinivasa Reddy

Download data to CSV file from SAP Lumira visualization and storyboards

Dear SCN Community,

I have been working in SAP Lumira since 5 months and my experience with this tool is amazing. But one thing I noticed is, at present I don’t see an option wherein we can download data back to either “.csv” or “.excel” format from Lumira desktop.

I believe this is feature is quite useful and most of us love the data enriching and saving the data in our local files for future purpose.

I thought of creating this feature as a custom extension in SAP Lumira.

Here it is:-


Step 1

The below screen has button style custom extension which I have created.  I have selected few dimension and measures.

/wp-content/uploads/2014/12/01_603321.jpg

Step 2

I clicked on the button “Export to CSV”. It popup a window asking file saved in which location.

Here i gave filename as “dataexport” and location at desktop.

/wp-content/uploads/2014/12/02_603322.jpg

Step 3:

Here I am opening the saved “dataexport.csv” to see the contents

/wp-content/uploads/2014/12/04_603365.jpg

Step 4:

I have used the same extension in story board as well to see filtering data is exported correctly.

/wp-content/uploads/2014/12/05_603366.jpg

Step 5:

I have used input control to filter the state to “Andhra Pradesh” and exported the data by clicking export data button.

File Name Given: dataexport-andhrapradesh.csv

Location: Desktop

/wp-content/uploads/2014/12/06_603367.jpg

Step 6:

Verified the contents of the file “dataexport-andrapradesh.csv”. Yes only “Andhra Pradesh” state data is exported.

/wp-content/uploads/2014/12/07_603369.jpg

This is very small feature and I believe this very much useful. Hope you guys like this.

With regards,

Hari Srinivasa Reddy, Manager SAP Analytics

NTT DATA

Assigned Tags

      5 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Shawn Penner
      Shawn Penner

      Would it be possible to see the source code that you wrote for your plugin?  Or is this just an idea that you have for a feature?  If it is an idea - I would recommend creating an ideaplace posting and linking to this blog.  If it is an actual plugin that you have created - I would be very interested in seeing the source code for it.

      Author's profile photo Hari Srinivasa Reddy
      Hari Srinivasa Reddy
      Blog Post Author

      Hope you have seen the source which shared here.

      Author's profile photo Former Member
      Former Member

      This option "export to csv " is not coming . How did you get???

      Author's profile photo Henry Banks
      Henry Banks

      Hi,

      this is a custom extension that he is showcasing, therefore a small piece of code that he has enhanced a chart type with.

      for what it's worth, this functionality is possible today in the current tool (albeit using slightly longer workflow):

      1. Create your chart/visualisation
      2. then, in the chart gallery (visualisation thumbnail ribbon) - right click "create new dataset"
      3. then switch to the new Dataset in prepare room
      4. then go to Share tab, select the new dataset and click Export as File > CSV

      regards,

      H

      Author's profile photo Hari Srinivasa Reddy
      Hari Srinivasa Reddy
      Blog Post Author

      Sorry. Some how I missed to follow this post.

      Yes as Henry rightly said is this is custom extension built.

      Here the sample code of render function.

      var render = function(data, container, width, height, colorPalette, properties, dispatch) {

        //prepare canvas with width and height of container

        container.selectAll('svg').remove();

              var vis = container.append('svg').attr('width', width).attr('height', height)

                          .append('g').attr('class', 'vis').attr('width', width).attr('height', height);

           

             

             

                container.selectAll('svg').remove();

                var vis = container.append('svg').attr('width', width).attr('height', height)

                .append('g').attr('class', 'div').attr('width', width).attr('height', height);

               

                var margin = {top: 30, right: 30, bottom: 0, left: 30},

                    width = 200 - margin.left - margin.right,

                    height = 200 - margin.top - margin.bottom;

               

                var b = {w: 75, h: 30, s: 3, t: 10};

               

                var dsets = data.meta.dimensions(0);

                var msets = data.meta.measures(0);

               

                var dimenion01 = dsets[0];

                var dimenion02 = dsets[1];

                var measure01  = msets[0];

                var measure02  = msets[1];

               

                var fdata = $.map(data, function (d, i){

                  return [[d[dimenion01] , d[dimenion02] , d[measure01], d[measure02]]];

                });

               

                            

                vis.append("rect").attr("x",width/2)

                .attr("y",height/2)

                .attr("fill","green")

                .attr("width",150)

                .attr("height",50)

                .attr("rx","10")

                .attr("ry","15")

                .style("stroke", "black")

                .style("stroke-width","5")

                .style("cursor","hand")

                .on("click",function(d, i){

                    var csvContent = "data:text/csv;charset=utf-8,"

                    var csvContentArray = [];

                    for (i=0;i<fdata.length-1;i++){

                          csvContentArray.push(fdata[i])

                          }

                    csvContent =  csvContent + csvContentArray.join("\n");

                    var encodedUri = encodeURI(csvContent);

                    window.open(encodedUri);

                    window.close

                });

                vis.append("text")

                .text("Export to CSV")

                .attr("font-size","15px")

                .attr("font-weight","bold")

                .attr("fill","white")

                .attr("x",(width/2) + 150/2)

                .attr("y",height/2+ 60/2)

                .attr("text-anchor","middle");

               

      // END: sample render code

          };

      Hope this helps.

      Cheers,

      Hari