hchart (Beta)

In [ ]:
%%hchart -c sql_command -f input_file -k 'auto' -o output_file

Draws responsive charts using the High Chart API: https://api.highcharts.com/highcharts/ The returned object can be customized using the API parameters and the 'set_dict_options' method.

⚠ Warning: This function uses the unsupported HighChart Python API. For more information, see python-hicharts repository.

Parameters

Name Type Optional Description
-c / --command
str
SQL Command to execute.
-f / --file
str
Input File. You can use this option if you want to execute the input file.
-k / --kind
str
Chart Type.
  • area : Area Chart
  • area_range : Area Range Chart
  • area_ts : Area Chart with Time Series Design
  • bar : Bar Chart
  • biserial : Biserial Point Matrix (Correlation between binary variables and numerical)
  • boxplot : Box Plot
  • bubble : Bubble Plot
  • candlestick : Candlestick and Volumes (Time Series Special Plot)
  • cramer : Cramer's V Matrix (Correlation between categories)
  • donut : Donut Chart
  • donut3d : 3D Donut Chart
  • heatmap : Heatmap
  • hist : Histogram
  • kendall : Kendall Correlation Matrix
    ⚠ Warning: This algorithm is computationally expensive; It uses a CROSS JOIN during the computation, the complexity of which is O(n * n), where n is the total number of elements in the vDataFrame.
  • line : Line Plot
  • negative_bar : Multi Bar Chart for binary classes
  • pearson : Pearson Correlation Matrix
  • pie : Pie Chart
  • pie_half : Half Pie Chart
  • pie3d : 3D Pie Chart
  • scatter : Scatter Plot
  • spider : Spider Chart
  • spline : Spline Plot
  • stacked_bar : Stacked Bar Chart
  • stacked_hist : Stacked Histogram
  • spearman : Spearman Correlation Matrix
-o / --output
str
Output File. You can use this option if you want to export the result of the query to the CSV or JSON format.

Returns

Highchart : Chart Object

Examples

These examples demonstrate the following:

  • Setting up the environment.
  • Drawing graphics.
  • Exporting to HTML.
  • Using variables.
  • Using SQL files.

Setting up the environment

If you don't already have one, create a new connection:

In [33]:
import verticapy as vp

# Save a new connection
vp.new_connection({"host": "10.211.55.14", 
                   "port": "5433", 
                   "database": "testdb", 
                   "password": "XxX", 
                   "user": "dbadmin"},
                   name = "VerticaDSN")

Otherwise, to use an existing connection:

In [34]:
vp.connect("VerticaDSN")

Load the extension:

In [1]:
%load_ext verticapy.hchart

To load a sample dataset. Once loaded, these datasets are stored in the 'public' schema. You can change the target schema with the 'schema' parameter:

In [4]:
from verticapy.datasets import load_titanic, load_amazon, load_iris

titanic = load_titanic()
amazon = load_amazon()
iris = load_iris()

Drawing Graphics

To draw responsive charts from SQL queries:

In [5]:
%hchart -k pie -c "SELECT pclass, AVG(age) AS av_avg FROM titanic GROUP BY 1;"
Execution: 0.034s
Out[5]:
In [3]:
%%hchart -k line
SELECT 
    date, 
    AVG(number) AS number
FROM amazon
GROUP BY 1;
Execution: 0.057s
Out[3]:
In [4]:
%%hchart -k heatmap
SELECT
    CORR_MATRIX(PetalLengthCm, 
                PetalWidthCm, 
                SepalLengthCm) OVER ()
FROM iris;
Execution: 0.06s
Out[4]:
In [5]:
%%hchart --kind hist
SELECT
    pclass, 
    SUM(survived)
FROM titanic GROUP BY 1;
Execution: 0.033s
Out[5]:
In [6]:
%%hchart --kind scatter
SELECT 
    PetalLengthCm, 
    PetalWidthCm, 
    Species
FROM iris;
Execution: 0.051s
Out[6]:
In [7]:
%%hchart -k spearman
SELECT * FROM titanic;
Execution: 0.064s
Out[7]:
In [2]:
%%hchart --kind boxplot
SELECT * FROM titanic;
Execution: 0.135s
Out[2]:

Exporting to HTML

To export a chart to HTML:

In [9]:
%%hchart -k spearman -o 'my_graphic'
SELECT * FROM titanic;
Execution: 0.062s
Out[9]:
In [10]:
file = open("my_graphic.html", "r")
print(file.read())
file.close()
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <link href="https://www.highcharts.com/highslide/highslide.css" rel="stylesheet" />
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script type="text/javascript" src="https://code.highcharts.com/6/highcharts.js"></script>
        <script type="text/javascript" src="https://code.highcharts.com/6/highcharts-more.js"></script>
        <script type="text/javascript" src="https://code.highcharts.com/6/modules/heatmap.js"></script>
        <script type="text/javascript" src="https://code.highcharts.com/6/modules/exporting.js"></script>
    </head>
    <body style="margin:0;padding:0">
                <div id="container" style="width:600px;height:400px;">Loading....</div>


    <script>
        $(function(){





            Highcharts.setOptions({"global": {}, "lang": {}});
            var option = {"chart": {"renderTo": "container", "width": 600, "height": 400, "type": "heatmap", "marginTop": 40, "marginBottom": 80, "plotBorderWidth": 1}, "colors": ["#263133", "#FE5016", "#0073E7", "#19A26B", "#FCDB1F", "#000000", "#2A6A74", "#861889", "#00B4E0", "#90EE90", "#FF7F50", "#B03A89"], "credits": {"enabled": false}, "drilldown": {}, "exporting": {}, "labels": {}, "legend": {"align": "right", "layout": "vertical", "margin": 0, "verticalAlign": "top", "y": 25, "symbolHeight": 295.0}, "loading": {}, "navigation": {}, "pane": {}, "plotOptions": {}, "series": {}, "subtitle": {}, "title": {"text": ""}, "tooltip": {"formatter": function () {return '<b>[' + this.series.xAxis.categories[this.point.x] + ', ' + this.series.yAxis.categories[this.point.y] + ']</b>: ' + this.point.value + '</b>';}}, "xAxis": {"title": {"text": ""}, "categories": ["\"pclass\"", "\"survived\"", "\"age\"", "\"sibsp\"", "\"parch\"", "\"fare\"", "\"body\""]}, "yAxis": {"title": {"text": ""}, "categories": ["\"pclass\"", "\"survived\"", "\"age\"", "\"sibsp\"", "\"parch\"", "\"fare\"", "\"body\""]}, "colorAxis": {"stops": [[0, "#0073E7"], [0.45, "#FFFFFF"], [0.55, "#FFFFFF"], [1, "#FE5016"]]}};


 

            var chart = new Highcharts.Chart(option);

            var data = [{"data": [[0, 0, 1.0], [0, 1, -0.34], [0, 2, -0.17], [0, 3, -0.07], [0, 4, -0.04], [0, 5, -0.72], [0, 6, 0.03], [1, 0, -0.34], [1, 1, 1.0], [1, 2, -0.09], [1, 3, 0.09], [1, 4, 0.17], [1, 5, 0.32], [1, 6, 0.21], [2, 0, -0.17], [2, 1, -0.09], [2, 2, 1.0], [2, 3, -0.16], [2, 4, -0.24], [2, 5, 0.0], [2, 6, -0.02], [3, 0, -0.07], [3, 1, 0.09], [3, 2, -0.16], [3, 3, 1.0], [3, 4, 0.44], [3, 5, 0.44], [3, 6, 0.03], [4, 0, -0.04], [4, 1, 0.17], [4, 2, -0.24], [4, 3, 0.44], [4, 4, 1.0], [4, 5, 0.4], [4, 6, 0.06], [5, 0, -0.72], [5, 1, 0.32], [5, 2, 0.0], [5, 3, 0.44], [5, 4, 0.4], [5, 5, 1.0], [5, 6, -0.0], [6, 0, 0.03], [6, 1, 0.21], [6, 2, -0.02], [6, 3, 0.03], [6, 4, 0.06], [6, 5, -0.0], [6, 6, 1.0]], "type": "heatmap", "dataLabels": {"enabled": true, "color": "#000000"}, "name": "Series 1", "borderWidth": 1}];
            var dataLen = data.length;
            for (var ix = 0; ix < dataLen; ix++) {
                chart.addSeries(data[ix]);
            }
 







        
    });
        </script>

    </body>
</html>

Using Variables

You can use variables in hcharts with the ':' operator.

In [5]:
import verticapy.stats as st

class_fare = titanic.groupby("pclass", 
                             [st.avg(titanic["fare"])._as("avg_fare")])
class_fare
Out[5]:
123
pclass
Integer
123
avg_fare
Float
1188.3537128205128
2221.4416984555985
3313.2290019637462
Rows: 1-3 | Columns: 2
In [6]:
class_fare.__genSQL__()
Out[6]:
'(SELECT "pclass", "avg_fare" FROM (SELECT "pclass", (AVG("fare")) AS avg_fare FROM "public"."titanic" GROUP BY 1) VERTICAPY_SUBTABLE) VERTICAPY_SUBTABLE'
In [8]:
%%hchart -k bar
SELECT * FROM :class_fare;
Execution: 0.039s
Out[8]:

Using SQL files

To create charts from a SQL file:

In [2]:
file = open("query.sql", "w+")
file.write("SELECT PetalLengthCm, PetalWidthCm, Species FROM iris;")
file.close()
In [3]:
%hchart -f query.sql -k scatter
Execution: 0.09s
Out[3]: