Add show values option for barplot/histplot/countplot on Seaborn

minjk-bl · minjk-bl · commit 7ddc8068cdc6 · 2022-06-16T11:13:52.000+09:00
diff --git a/html/m_visualize/seaborn.html b/html/m_visualize/seaborn.html
@@ -114,6 +114,9 @@
                                                 <!-- Auto-create -->
                                             </select>
                                         </div>
+                                        <div class="vp-grid-box sb-option">
+                                            <label><input type="checkbox" id="showValues" class="vp-state"/><span>Show values</span></label>
+                                        </div>
                                     </div>
                                     <label for="userOption" class="vp-bold">User Option</label>
                                     <input type="text" id="userOption" class="vp-input vp-state wp100" placeholder="key=value, ..."/>
diff --git a/js/m_visualize/Seaborn.js b/js/m_visualize/Seaborn.js
@@ -48,6 +48,7 @@ define([
                 bins: '',
                 kde: '',
                 stat: '',
+                showValues: false,
                 // axes options
                 x_limit_from: '',
                 x_limit_to: '',
@@ -190,6 +191,10 @@ define([
                     $(that.wrapSelector('#bins')).closest('.sb-option').show();
                     $(that.wrapSelector('#kde')).closest('.sb-option').show();
                     $(that.wrapSelector('#stat')).closest('.sb-option').show();
+                } else if (chartType == 'barplot') {
+                    $(that.wrapSelector('#showValues')).closest('.sb-option').show();
+                } else if (chartType == 'countplot') {
+                    $(that.wrapSelector('#showValues')).closest('.sb-option').show();
                 }
             });
             
@@ -403,6 +408,10 @@ define([
                 $(page).find('#bins').closest('.sb-option').show();
                 $(page).find('#kde').closest('.sb-option').show();
                 $(page).find('#stat').closest('.sb-option').show();
+            } else if (this.state.chartType == 'barplot') {
+                $(page).find('#showValues').closest('.sb-option').show();
+            } else if (this.state.chartType == 'countplot') {
+                $(page).find('#showValues').closest('.sb-option').show();
             }
 
             //================================================================
@@ -696,7 +705,7 @@ define([
 
         generateCode(preview=false) {
             let { 
-                chartType, data, x, y, hue, setXY, userOption='', 
+                chartType, data, x, y, setXY, hue, kde, stat, showValues, userOption='', 
                 x_limit_from, x_limit_to, y_limit_from, y_limit_to,
                 xticks, xticks_label, xticks_rotate, removeXticks,
                 yticks, yticks_label, yticks_rotate, removeYticks,
@@ -721,6 +730,9 @@ define([
                 // TODO: marker to seaborn argument (ex. marker='+' / markers={'Lunch':'s', 'Dinner':'X'})
                 etcOptionCode.push(com_util.formatString("marker='{0}'", markerStyle));
             }
+            if (showValues === true && chartType === 'barplot') {
+                etcOptionCode.push('ci=None');
+            }
 
             // add user option
             if (userOption != '') {
@@ -837,10 +849,20 @@ define([
                 let defaultHeight = 6;
                 code.appendFormatLine('plt.figure(figsize=({0}, {1}))', defaultWidth, defaultHeight);
 
-                code.appendLine(generatedCode);
+                if (showValues && showValues === true) {
+                    code.appendLine('ax = ' + generatedCode);
+                    code.appendLine("vp_seaborn_show_values(ax)");
+                } else {
+                    code.appendLine(generatedCode);  
+                }
                 code.appendLine(chartCode.toString());
             } else {
-                code.appendLine(generatedCode);
+                if (showValues && showValues === true) {
+                    code.appendLine('ax = ' + generatedCode);
+                    code.appendLine("vp_seaborn_show_values(ax)");
+                } else {
+                    code.appendLine(generatedCode);  
+                }
                 if (chartCode.length > 0) {
                     code.append(chartCode.toString());
                 }
