Merge pull request #110 from ViderumGlobal/add-axis-labeling

Add axis labeling

Author: ZoranPandovski

ckanext/querytool/controllers/querytool.py

@@ -273,6 +273,10 @@ def edit_visualizations(self, querytool=None, data=None,
                         visualization['show_legend'] = 'true'
                     else:
                         visualization['show_legend'] = 'false'
+                    if 'chart_field_labels_{}'.format(id) in data:
+                        visualization['show_labels'] = 'true'
+                    else:
+                        visualization['show_labels'] = 'false'
 
                     visualizations.append(visualization)
 

ckanext/querytool/fanstatic/javascript/modules/viz-preview.js

@@ -85,6 +85,8 @@ ckan.module('querytool-viz-preview', function() {
             var y_tick_format = this.options.y_tick_format;
             var padding_top = this.options.padding_top;
             var padding_bottom = this.options.padding_bottom;
+            var show_labels = this.options.show_labels;
+
             var options = {
                 bindto: this.el[0],
                 color: {
@@ -214,7 +216,8 @@ ckan.module('querytool-viz-preview', function() {
                 values.unshift(this.options.y_axis);
                 options.data = {
                     columns: [values],
-                    type: ctype
+                    type: ctype,
+                    labels: show_labels
                 };
                 options.axis = {
                     y: {
@@ -261,7 +264,7 @@ ckan.module('querytool-viz-preview', function() {
             var chartTitleVal = chartTitle.val();
 
             var legend =  chartField.find('input[name*=chart_field_legend_]');
-            var legendVal = legend.is(':checked')
+            var legendVal = legend.is(':checked');
 
             var xTextRotate = chartField.find('[name*=chart_field_x_text_rotate_]');
             var xTextRotateVal = xTextRotate.val();
@@ -280,6 +283,10 @@ ckan.module('querytool-viz-preview', function() {
 
             var paddingBottom = chartField.find('input[name*=chart_field_padding_bottom_]');
             var paddingBottomVal = paddingBottom.val();
+
+            var dataLabels =  chartField.find('input[name*=chart_field_labels_]');
+            var dataLabelsVal = dataLabels.is(':checked');
+
             // If the changed values from the dropdowns are from color, chart type or text rotate
             // then just update the chart without fetching new data. This leads
             // to a better UX.
@@ -296,6 +303,7 @@ ckan.module('querytool-viz-preview', function() {
                 this.options.y_tick_format = yTickFormatVal;
                 this.options.padding_top = paddingTopVal;
                 this.options.padding_bottom = paddingBottomVal;
+                this.options.show_labels = dataLabelsVal;
                 this.createChart(this.fetched_data);
 
                 return;
@@ -313,6 +321,7 @@ ckan.module('querytool-viz-preview', function() {
             this.options.y_tick_format = yTickFormatVal;
             this.options.padding_top = paddingTopVal;
             this.options.padding_bottom = paddingBottomVal;
+            this.options.show_labels = dataLabelsVal;
             var newSqlString = this.create_sql_string();
 
             this.get_resource_datа(newSqlString);

ckanext/querytool/templates/ajax_snippets/chart_fields.html

@@ -60,6 +60,16 @@
       </div>
 
       {% if chart %}
+        {% set show_labels = chart.show_labels %}
+      {% endif %}
+      <div class="control-group ">
+        <label class="control-label" for="chart_field_labels_{{ n }}">{{ _('Show data labels') }}</label>
+        <div class="controls ">
+          <input id="chart_field_labels_{{ n }}" type="checkbox" name="chart_field_labels_{{ n }}" value="{{ show_labels }}"{% if show_labels=='false' %}{% else %}checked{% endif %}>
+        </div>
+      </div>
+
+        {% if chart %}
         {% set show_legend = chart.show_legend %}
       {% endif %}
       <div class="control-group ">
@@ -148,6 +158,7 @@
         {% set y_tick_format = chart.y_tick_format %}
         {% set padding_bottom = chart.padding_bottom %}
         {% set padding_top = chart.padding_top %}
+        {% set show_labels = chart.show_labels %}
       {% endif %}
 
       {% snippet 'ajax_snippets/visualization_item.html',
@@ -164,7 +175,8 @@
           tooltip_format = tooltip_format,
           y_tick_format = y_tick_format,
           padding_bottom = padding_bottom,
-          padding_top = padding_top
+          padding_top = padding_top,
+          show_labels = show_labels
       %}
     </div>
 </div>

ckanext/querytool/templates/ajax_snippets/visualization_item.html

@@ -12,6 +12,7 @@
      data-module-tooltip_format="{{ tooltip_format }}"
      data-module-y_tick_format="{{ y_tick_format }}"
      data-module-padding_top="{{ padding_top }}"
-     data-module-padding_bottom="{{ padding_bottom }}">
+     data-module-padding_bottom="{{ padding_bottom }}"
+     data-module-show_labels="{{ show_labels }}">
      Loading...
     </div>

ckanext/querytool/templates/querytool/public/read.html

@@ -82,7 +82,8 @@ <h1>{{ querytool.title }}</h1>`
         tooltip_format = item.tooltip_format,
         y_tick_format = item.y_tick_format,
         padding_bottom = item.padding_bottom,
-        padding_top = item.padding_top
+        padding_top = item.padding_top,
+        show_labels = item.show_labels
         %}
       </div>
     {% endfor %}