Added HighMaps #92

Prakriti-nith · 2018-05-19T19:05:28Z

Examples link: 1, 2, 3,

I am working on loading less js files.

Prakriti-nith · 2018-05-23T17:17:19Z

Revised Examples (containing modules option): link1, link2, link3.
I have kept all the modules of HighCharts, HighStock and HighMaps in the /modules folder so that user only needs to specify the name of the module (like europe.js) and that will be loaded. I am loading the modules in show_in_iruby method before getting the script of the chart and it is working fine now.
For the 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?

Prakriti-nith · 2018-05-25T08:14:13Z

When the plotting_library (or dependent_script) is set to highcharts, the dependencies (highstock.js, map.js) and the dependencies of the basic modules that are common to all the three (HighCharts, HighStock, HighMaps) will be loaded. Then the user can provide the required modules of the chart in options. These will be loaded in show_in_iruby for iruby notebook and in div (i.e., in to_html) for web frameworks.

Shekharrajak

Write examples easy to advance. Also use daru dataframe, vector in most of the places along with list or json object.

Shekharrajak · 2018-05-26T09:41:14Z

lib/daru/view/adapters/highcharts/display.rb

@@ -3,7 +3,7 @@

 module LazyHighCharts
  def self.init_script(
-    dependent_js=['highstock.js', 'highcharts-more.js', 'modules/exporting.js',
+    dependent_js=['highstock.js', 'map.js', 'modules/exporting.js',


Since it is constant we must place all the constant variable into one file, to make it loosely coupled. Accessing these constants into multiple files will be better.

Shekharrajak · 2018-05-26T09:42:18Z

lib/daru/view/adapters/highcharts/display.rb

@@ -61,6 +64,17 @@ def to_html_iruby(placeholder=random_canvas_id)
      high_chart_iruby(extract_chart_class, placeholder, self)
    end

+    # @return load the dependent modules of the chart


At least Input parameter and return object must be documented according to yard.

Prakriti-nith · 2018-05-26T13:15:20Z

I have written the examples here: link1, link2, link3.

Prakriti-nith · 2018-05-27T12:50:59Z

In this commit I have:

Loaded the mapdata for each chart directly from options[:chart][:map]. This option is always provided by the user which requires additional mapdata. It is actually the path of the dependent js file. So no need to explicitly provide it in modules option.
User can still provide modules option for highcharts modules (treemap.js, tilemap.js, sankey.js, etc) as modules/treemap, etc. I will add these dependencies and their examples in a separate PR.
Refactored rake task accordingly.
Added more examples of countries with data as Daru::DataFrame.
Kept the constants in a separate file.
Run all the examples and committed to ensure nothing is breaking.

Examples: Countries, General, Series, Dynamic.
Please review this PR and let me know any changes that I have to make.

Shekharrajak · 2018-05-30T14:48:34Z

Please use directly Daru::View::Plot.new(data, opts) in every examples containing #chat.options ,#chat.series_data . Isn't that work if we use data = series_dt ?

Prakriti-nith · 2018-05-30T17:26:56Z

I tried using data = series_dt but it was not working as most of the advance highmaps use multiple series' or data in a specified format. I have included the examples of Daru::DataFrame here.

Shekharrajak · 2018-05-30T14:56:38Z

lib/daru/view/adapters/highcharts/display.rb

+      dep_js = []
+      # Mapdata dependencies
+      if !options[:chart_class].nil? && options[:chart_class].capitalize == 'Map'
+        dep_js.push('mapdata/' + options[:chart][:map].to_s + '.js') if


user input countries/folder1/folder2 things is making it complicated. Think about other solution.

I have kept the same folder structure provided in the highcharts dependencies. It is because the value provided by the user (it is in highcharts option and will be provided everytime user needs some mapdata dependency) in options[:chart][:map] will be the same as of the dependencies and by this folder structure it will be easy to retrieve the data.

Shekharrajak · 2018-05-30T14:58:27Z

lib/daru/view/adapters/highcharts/display.rb

+      end
+      # Dependencies provided in modules option (of highcharts mainly
+      #   like tilemap) by the user
+      dep_js |= options.delete(:modules).map! { |js| "#{js}.js" } unless


I think , options created by us (like chart_class, modules, map ) must be in separate parameter. Only highcharts options must be passed as 2nd parameter. WDYT?

map option is not created by us and will be provided in highcharts' options everytime there is a need for map data(like europe.js). This would be the exact address of the dependency required.
For example, a user using dependency https://code.highcharts.com/mapdata/countries/in/in-all.js will provide countries/in/in-all as a value for options[:chart][:map].
Only the options chart_class and modules are created by us. User does not need to provide any additional option for mapdata.
Yes, we can have a third parameter for these but IMO that would be only more complex for the user plus we then have to generalize it for other adapters as well which I think is not a good option.

User will put path for the js to load in modules options (indirectly), right? Any other use case?

modules option is created just to load some additional dependencies used in a specific chart by the user.

Shekharrajak · 2018-05-30T14:58:46Z

lib/daru/view/adapters/highcharts/display.rb

+      options[:modules].nil?
+      dep_js
+    end
+    # rubocop:enable Metrics/AbcSize


Did you try to fix rubocop error?

Yes, I tried removing it but the conditions are necessary. Please provide any suggestions to fix it.

I guess, it must have method to check for map chart and chart class. if condition inside if condition looks bad.

I tried it earlier but still, there was rubocop error. I have separated out the method.

Shekharrajak · 2018-05-30T15:02:07Z

lib/tasks/high_charts.rake

+      sh "mkdir -p lib/daru/view/adapters/js/highcharts_js/mapdata/countries/"
+      sh "mkdir -p lib/daru/view/adapters/js/highcharts_js/mapdata/custom/"
+
+      countries_folders = ['in', 'us', 'gb', 'af', 'au', 'bd', 'be', 'ca', 'cn', 'fr']


Only these many countries ? What will be total size of js if we download all the js ?

I think around 10 - 15 MBs. Ok, I will download them all.

Shekharrajak · 2018-05-30T18:44:23Z

lib/daru/view/adapters/highcharts/display.rb


 module LazyHighCharts
  def self.init_script(
-    dependent_js=['highstock.js', 'highcharts-more.js', 'modules/exporting.js',
-                  'highcharts-3d.js', 'modules/data.js']
+    dependent_js=[HIGHSTOCK, MAP, EXPORTING, HIGHCHARTS_3D, DATA]


[HIGHSTOCK, MAP, EXPORTING, HIGHCHARTS_3D, DATA] is also constant as web app highcharts dependencies.

Prakriti-nith · 2018-05-30T20:59:54Z

I have added examples of highcharts that use modules option and have also updated the highstock examples (link1, link2, link3) using Daru::View::Plot.new(data, opts).

Prakriti-nith · 2018-06-01T21:55:48Z

I have added the support for multiple series in highcharts. I have also updated all the examples of highcharts, highstock and highmaps using Daru::View::Plot.new(data, opts) and almost all the highstock examples using Daru::DataFrame, Daru::Vector or Array as data.

Prakriti-nith · 2018-06-02T21:35:06Z

@Shekharrajak please review the changes.

Shekharrajak · 2018-06-03T17:56:05Z

lib/daru/view/adapters/highcharts.rb

-            series_name = options[:name] unless options[:name].nil?
-            f.series(type: series_type, name: series_name, data: data_new)
+            # For multiple series
+            if data.is_a?(Array) && data[0].is_a?(Hash)


this if data.is_a?(Array) && data[0].is_a?(Hash); must be under guess_data , right ?

Please share the link for multiple series example.

Multiple series are used in almost all the HighCharts and HighMaps examples like: (link1, link2, link3). guess_data does not work for Array of Hashes (Multiple series) and will raise ArgumentError. Our data is already in the series format and can be used directly.
As highcharts supports multiple series in a single chart, I was thinking that in future a feature where multiple Daru::DataFrame, Daru::Vector can be used in a single Highchart/stock/map can be added.

Shekharrajak · 2018-06-03T18:46:37Z

lib/daru/view/adapters/highcharts/display.rb

@@ -33,22 +33,25 @@ class HighChart
    #
    def to_html(placeholder=random_canvas_id)
      chart_hash_must_be_present
+      script = load_dependencies('web_frameworks')


So now each time dependencies will be loaded, whenever to_html is invoked. Can we control this loading (it will load once), using Proxy design pattern?

to_html will load the dependencies only if there is some additional dependency provided in the modules option or if a map is being drawn (to load the required map data). Otherwise, load_dependencies will simply return an empty string. I will look into the Proxy design pattern also.

Shekharrajak · 2018-06-03T18:50:10Z

lib/daru/view/adapters/highcharts/display.rb

+      end
+      # Dependencies provided in modules option (of highcharts mainly
+      #   like tilemap) by the user
+      dep_js |= options.delete(:modules).map! { |js| "#{js}.js" } unless


User will put path for the js to load in modules options (indirectly), right? Any other use case?

Shekharrajak · 2018-06-03T19:11:43Z

lib/daru/view/adapters/highcharts/display.rb

+      options[:modules].nil?
+      dep_js
+    end
+    # rubocop:enable Metrics/AbcSize


I guess, it must have method to check for map chart and chart class. if condition inside if condition looks bad.

Shekharrajak · 2018-06-03T19:14:31Z

spec/adapters/highcharts/display_spec.rb

@@ -35,6 +35,7 @@
      chart: {
        type: 'bar'
      },
+      modules: ['modules/treemap'],


treemap for bar chart?

Shekharrajak · 2018-06-10T04:46:22Z

lib/daru/view/adapters/highcharts.rb

+            # For multiple series when data is in a series format as in
+            # HighCharts official examples
+            # TODO: Add support for multiple series when data as Daru::DataFrame/Daru::Vector
+            if data.is_a?(Array) && data[0].is_a?(Hash)


It is already working for multiple series, since it is checking for array in guess_data , right ?

Yes, it is checking but not working. As here #chart.series method is generating a single series with single data parameter. Multiple series contain Array of hashes and data parameter for each hash (i.e. for each series).
Also, I tried using #chart.series_data for data_new as well but this works only when data is provided as in official highcharts series format (i.e. Array of Hashes).

Shekharrajak · 2018-06-10T04:48:13Z

lib/daru/view/adapters/highcharts/display.rb

+      options[:chart] &&
+      options[:chart][:map]
+    end
+    # rubocop:enable Metrics/AbcSize


remove this line.

IMO all the four conditions are necessary. Which one should I remove?

Shekharrajak · 2018-06-10T04:49:37Z

lib/daru/view/adapters/highcharts/display.rb

+    # @return [void] Appends the map data in dep_js
+    # rubocop:disable Metrics/AbcSize
+    def get_map_data_dependencies(dep_js)
+      dep_js.push('mapdata/' + options[:chart][:map].to_s + '.js') if


if (condition) .. statements... ....

is easy to understand rather than this.

Shekharrajak · 2018-06-10T07:28:48Z

I want to discuss about the future implementation (that we can do to improve it),if anything in TODO for map part.

Update them here: https://github.com/SciRuby/daru-view/wiki/HighCharts-features

Prakriti-nith · 2018-06-10T20:44:52Z

I wanted to edit the wiki online but it says You do not have permission to update this wiki. Please provide the required permissions.

Shekharrajak · 2018-06-11T07:09:13Z

Wait, I didn't know about that. It will be public soon.

Prakriti-nith · 2018-06-14T19:51:09Z

@Shekharrajak I have made the required changes. Please review.

Shekharrajak · 2018-06-16T10:22:10Z

Please add some solid examples that can show the full features of daru-view/highcharts/highmap in new wiki page ( Starting from easy to advance). It will be very useful , since there are lot of new things added in this PR.

Once you resolve the conflicts, it will be merged.
Thanks!

Shekharrajak

Good work!

Shekharrajak · 2018-06-16T10:44:18Z

lib/daru/view/adapters/highcharts/display.rb

+
+    # @param dep_js [Array] JS dependencies required for drawing a map(mapdata)
+    # @return [void] Appends the map data in dep_js
+    def get_map_data_dependencies(dep_js)


According to HighMap option map, we are loading the respective js files (so no need to load not used files).

But need to find a way to capture the loaded js files, so that next time we run to_html or generate the script it won't load the file, that is already loaded into the same web-page.

Shekharrajak · 2018-06-16T10:45:48Z

lib/tasks/high_charts.rake

@@ -57,4 +63,55 @@ namespace :highcharts do
    end
  end

+  task :map do


Need to find a way to handle many js files . It is increasing the gem size.

Shekharrajak · 2018-06-16T10:48:03Z

Noting down few important points, for future plan :

Anything you want to add here , @Prakriti-nith ?

Prakriti-nith force-pushed the highmap branch from 0314f9e to 7c31af7 Compare May 22, 2018 13:49

Added HighMap

196dba5

Prakriti-nith force-pushed the highmap branch from 7c31af7 to 196dba5 Compare May 23, 2018 16:19

Updating js files

02237bf

Prakriti-nith added 2 commits May 24, 2018 00:23

Added HighMap Daru::DataFrame example

634b1bb

Separated dependent modules

75909cb

Single method load_modules

c293605

Shekharrajak reviewed May 26, 2018

View reviewed changes

Prakriti-nith added 2 commits May 26, 2018 19:03

Updated documentation of the method load_modules

633be78

Loading mapdata directly from options[:chart][:map]

dc876d0

Shekharrajak reviewed May 30, 2018

View reviewed changes

Added more examples of HighCharts

c242a7c

Prakriti-nith added 3 commits May 31, 2018 05:08

Downloaded countries and custom mapdata

f423193

Updated highstock examples using Daru::View::Plot.new(data, opts)

05e0e90

Added support for multiple series and updated the examples

11479ed

rake task linelength

b219f80

Shekharrajak reviewed Jun 3, 2018

View reviewed changes

Prakriti-nith added 2 commits June 4, 2018 02:27

created get_map_data_dependencies method

8d1449f

Added TODO for multiple series using Daru::DataFrame

a801c65

Prakriti-nith force-pushed the highmap branch from ecea81d to a801c65 Compare June 4, 2018 02:45

Shekharrajak reviewed Jun 10, 2018

View reviewed changes

Fix rubocop offence

5db05fa

Correct line length

2b15433

Prakriti-nith force-pushed the highmap branch from 6809d90 to 861d1a4 Compare June 15, 2018 09:33

Use let instead of before

1b5990f

Prakriti-nith force-pushed the highmap branch from 861d1a4 to 1b5990f Compare June 15, 2018 11:53

Merge branch 'master' into highmap

ba3dd19

Shekharrajak approved these changes Jun 16, 2018

View reviewed changes

Shekharrajak merged commit 3a36663 into SciRuby:master Jun 16, 2018

Added HighMaps #92

Added HighMaps #92

Conversation

Prakriti-nith commented May 19, 2018

Prakriti-nith commented May 23, 2018

Prakriti-nith commented May 25, 2018

Shekharrajak left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Prakriti-nith commented May 26, 2018

Prakriti-nith commented May 27, 2018 • edited Loading

Shekharrajak commented May 30, 2018

Prakriti-nith commented May 30, 2018

Choose a reason for hiding this comment

Prakriti-nith May 30, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Prakriti-nith May 30, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Prakriti-nith commented May 30, 2018 • edited Loading

Prakriti-nith commented Jun 1, 2018

Prakriti-nith commented Jun 2, 2018

Choose a reason for hiding this comment

Prakriti-nith Jun 3, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Shekharrajak commented Jun 10, 2018

Prakriti-nith commented Jun 10, 2018

Shekharrajak commented Jun 11, 2018

Prakriti-nith commented Jun 14, 2018

Shekharrajak commented Jun 16, 2018

Shekharrajak left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Shekharrajak commented Jun 16, 2018

Prakriti-nith commented May 27, 2018 •

edited

Loading

Prakriti-nith May 30, 2018 •

edited

Loading

Prakriti-nith May 30, 2018 •

edited

Loading

Prakriti-nith commented May 30, 2018 •

edited

Loading

Prakriti-nith Jun 3, 2018 •

edited

Loading