Add comments

Author: b-yogesh

dashipy/my_extension/my_panel_1.py

@@ -49,9 +49,17 @@ def render_panel(ctx: Context) -> Component:
 )
 def make_figure(ctx: Context, selected_dataset: int = 0) -> alt.Chart:
     dataset = ctx.datasets[selected_dataset]
+
+    # Create a slider
     corner_slider = alt.binding_range(min=0, max=50, step=1)
+    # Create a parameter and bind that to the slider
     corner_var = alt.param(bind=corner_slider, value=0, name="cornerRadius")
-    click_param = alt.selection_point(on="click", name="onClick", fields=["a", "b"])
+    # Create another parameter to handle the click events and send the data as
+    # specified in the fields
+    click_param = alt.selection_point(on="click", name="onClick",
+                                      fields=["a", "b"])
+    # Create a chart type using mark_* where * could be any kind of chart
+    # supported by Vega. We can add properties and parameters as shown below.
     fig = alt.Chart(dataset).mark_bar(cornerRadius=corner_var).encode(
         x=alt.X('a:N', title='a'),
         y=alt.Y('b:Q', title='b'),
@@ -65,5 +73,5 @@ def make_figure(ctx: Context, selected_dataset: int = 0) -> alt.Chart:
         height=300,
         title="Vega charts"
     ).add_params(corner_var, click_param)
-    print(fig.to_json())
+
     return fig

dashipy/my_extension/my_panel_2.py

@@ -51,6 +51,10 @@ def make_figure(ctx: Context, selected_dataset: int = 0) -> alt.Chart:
     dataset = ctx.datasets[selected_dataset]
     slider = alt.binding_range(min=0, max=100, step=1, name='Cutoff ')
     selector = alt.param(name='SelectorName', value=50, bind=slider)
+    # Almost same as the chart in Panel 1, but here we use the Shorthand
+    # notation for setting x,y and the tooltip, although they both give the
+    # same output. We also call interactive() on this chart object which allows
+    # to zoom in and out as well as move the chart around.
     fig = alt.Chart(dataset).mark_bar().encode(
         x='a:N',
         y='b:Q',
@@ -65,7 +69,7 @@ def make_figure(ctx: Context, selected_dataset: int = 0) -> alt.Chart:
     height=300,
     title="Vega charts using Shorthand syntax"
     ).add_params(
-        selector,
+        selector
     ).interactive()
     return fig