GSoC 2108 Project [ Advance features in daru-view ] discussion

GSoC GSOC 2018
21

Thanks.
Following are the points which I want to discuss:

  1. In the implementation of HighMaps, many of the HighMaps require additional js code (other than options and data) so less number of examples will be covered.
  2. There is some conflict with the arrangement of dependent js files of highmap, highstock, highchart and their modules. (Some of the maps require highmaps dependency but Chart keyword to draw the map so I can not separate out the dependent js files of highmap and highchart)
22

Regarding the dependent js files of HighMaps and HighStock, I am unable to check which order of js files is working as IRuby notebook examples are working abruptly while loading the js files. For eg, first, I loaded only the dependent files of HighStock so highcharts and highstock were working fine. Then I removed those js files (from dependent_js in iruby_notebook.rb) and included only those of HighMap. Now, HighMap was working fine but HighStock was also working (while HighCharts examples are not working).
Sometimes HighStock js files worked for both HighMap and HighStock. Not only these, at first highmaps js was not drawing a map and after a while with the same dependent js, Map was correctly drawn.
I also tried it in incognito window but the result was same. Examples are working very abruptly.

23

Regarding the last problem I was facing, I tried running the HighMap examples using rails app and they run as expected. This might underline that the problem with the IRuby notebook is the cache stored previously producing vague results. Also, I got to know the correct order of the dependent js of HighMaps and HighStock.
Still, there is some problem with the colours in IRuby for some examples of HighMap which are working correctly in rails.

24

@Prakriti, Meanwhile you try to improve your testcases. Understand how it is written in Nyaplot, lazy_high_charts, google_visualr gem. Check the coverage report for googlecharts, highcharts adapter in daru-view and try to make it +90% (may be in separate PR).

daru-view is plugin gem for daru, so you must have specs where data as daru dataframe/vector . Don’t just use the #chart, #chart.options to set the options all the time. Use Daru::View::Plot.new(data, options) , and this object for plotting and it’s instance methods to test.

Regrads,
Shekhar

25

@shekharrajak, Sure, will do it.

26

@Prakriti, We can discuss about the progress and doubts on 19th may after 9pm.

27

I will be available. Thanks.

28

Summary of today’s (19th May) meeting:

  1. Loading of dependent js files: We have a bunch of dependent js files to load for highcharts, highstock, highmaps and their modules. So, for now, we plan to load dependent js files for just highstock, highmaps and some of the common modules and might be able to provide some option for the others while creating the chart.
  2. Data of HighMap in Daru::DataFrame/ Daru::Vector format: Some of the examples like Honeycomb Map and Distribution Map uses data which is difficult to incorporate Daru::DataFrame/ Daru::Vector format. So, for now, I am trying on how to get the data in the required format.
  3. I will add the required rails examples in demo_daru-view repo.
29

Report for 19th May:
I worked on improving the coverage report of Highcharts.rb through this commit.

30

Thanks @Prakriti, for writing Minutes of meeting .

I feel that you need to learn about SOLID design principles , software design patterns, better exception handling, extendable & modular and some other concepts to code like a pro.

Meanwhile keep writing examples in demo-daru_view (learn rails, sinatra, nanoc, hanami) repo.

Regards,
Shekhar

31

I was thinking of a way to load dependent js files of modules separately. We can provide another option modules for the user but that would create problems:

  1. In web frameworks dependent js files must be loaded in head tag and fetching js files in the head tag would be difficult from that option.
  2. In IRuby notebook, we can also set options as plot.chart.options = options, so we’ll be loading dependent js when show_in_iruby will be called (as we are not getting options in the plot object here) which might create conflicts in display of chart before loading appropriate js files.

So, I thought of including the modules (by the user as a separate parameter) when the plotting_library or dependent_script is set but that would create design problems as it is highcharts specific. Any other idea that we could try?

32

Please add more lines for clarification. How it would be difficult.

Hm, then it will load the same js code whenever show_in_iruby is called.

I hope you will come with some good idea before friday.

33

Report for 22nd May:
I spent the day working on custom styling CSS.
There are two modes of Highcharts: Classic and Styled.
Classic mode provides some custom CSS styling and does not require any additional dependencies while styled mode uses js dependency (like https://code.highcharts.com/stock/js/highstock.js) replacing the older one + the CSS dependency and provides full custom CSS styling.
I have implemented the Styled mode for web frameworks but as there is no method to load CSS files in IRuby notebook, so I have kept classic mode for IRuby notebook where some styling can be provided.
User needs to provide the required CSS styling in CSS option.
I have opened a PR regarding the same.
Difficulties: For loading CSS in IRuby notebook, custom.css could be a rescue but then everytime user needs to load the CSS files in custom.css. I am searching for some other way out (refer).

1 Like
34

Report for 23rd May:

  1. I added examples of the custom styling CSS in IRuby notebook in this PR.
  2. I worked on separating the dependent js files. User can provide the required js files in modules option as a list of Strings. In IRuby notebook, these will be loaded when show_in_iruby is called (working fine now, had some problem earlier). I have implemented it in this PR. I have modified the examples of HighMaps and HighStock accordingly.
    In web frameworks, div method is called. So I tried loading the dependent js in to_html method which is working correctly. My concern is that the dependent files of the modules are not loaded in the head tag instead they are loaded into the body before the script of the chart, so will it be a problem?
  3. Added HighMap example for data as Daru::DataFrame in this commit.

Also, have a look at the revised blog post for the first week. :slight_smile:

35

Minutes of the meeting (26th May’ 2018) :

  1. HighMaps: We need to add more examples of HighMaps with data in Daru::DataFrame or Daru::Vector format. All the examples of HighMaps can be found here.
  2. Transfer of all the js and CSS dependencies to the assets folder.
  3. The folder structure of the js dependencies should be maintained.
  4. All the constants should be kept in a separate file.
36

@Prakriti, write down your proposed ideas on GoogleCharts, your current research, what do you want to implement and what not.

We recommend you to explore more about googlecharts from official site and let us know your research.

1 Like
37

Minutes of the meeting (3rd June’ 2018):

  1. GoogleCharts: We would be implementing the following in GoogleCharts:
    a. ChartWrapper class that wraps around the chart and does all the loading and data source querying.
    b. ChartEditor class that provides runtime editing.
    c. Exporting of GoogleCharts to different formats.
    d. Multiple Charts in a single row (Needs to be done for all adapters).
    e. Importing data from google spreadsheets. (Have already opened a PR. Facing some problems earlier but now fixed).
    f. Adding Toolbar in GoogleCharts to export the data in CSV and HTML format(Optional).
    g. Adding listeners in GoogleCharts (Optional).
    h. Adding more methods of DataTables (Optional - will be doing only if we get some solid use case).

  2. 3rd parameter: Will be adding 3rd optional parameter that will contain the hash of options created by us like modules, chart_class and CSS in HighCharts. This will be done in a separate PR.

  3. Updating Daru-view wiki: Wiki needs to be updated with the highcharts features added, with examples and the future possibilities in highcharts.

38

Hello @Prakriti,

Please let us know the update and fill this wiki page, mentioning what is completed till phase 1, TODO part (challenges you faced), and next plan. You will see the edit button for wiki page once it is public.

Regards,
Shekhar

39

Sure, I will update the wiki page.

40

Update on the work in daru-view:
For the past two weeks, I worked on the following tasks:

  1. Exporting of HighCharts in different formats: Through this feature, user can export the HighChart in various formats (PDF, PNG, JPEG, and SVG) using the code. It is running fine in web frameworks. Progress can be tracked via this PR.
  2. ChartWrapper: It facilitates the use of view option and paves the way to implement ChartEditor. I have opened a PR to implement this feature.
  3. Import data from Google spreadsheet in google charts: I opened this PR earlier but was facing some issues which have been resolved now.
  4. ChartEditor: Right now I am working on it which provides the facility to edit the Chart on the fly. Check out this PR for its implementation.

Challenges and difficulties:

  1. Exporting of HighChart in IRuby notebook can be done either offline and online and both have their pros and cons. I am still confused which one should be implemented. Right now, I have kept the online exporting.
  2. I am facing some problem in the display of ChartEditor dialog box in IRuby notebook. I tried a lot regarding the same but am still facing the issue.
  3. In GoogleCharts, js script of the Chart is generated in two ways, i.e., with script tag and without script tag while we need only the latter one.