# Examples

Many of these examples are derived from the ezhc library. More examples will be added as the package development carries on.

TIP

At any moment, if you want to know how to create an ipyhc like the doc examples, search the example you need in this interactive notebook:

# Time series

This example shows a simple HighStock time series, with a custom tooltip.


data = hc.sample.df_timeseries(N=2, Nb_bd=15+0*3700)

options = {
    'credits': {'enabled': True,
                'text': 'Source: XXX Flow Strategy & Solutions.',
                'href': 'http://www.example.com'},
    'exporting': {'enabled': True},
    'chart': {'zoomType': 'xy'},
    'plotOptions': {'series': {'compare': 'percent'}},
    'legend': {'enabled': True,
               'layout': 'horizontal',
               'align': 'center',
               'maxHeight': 100},
    'tooltip': {'enabled': True,
                'valueDecimals': 2,
                'pointFormat': '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.change}%)<br/>',
                'positioner': "function(labelWidth, labelHeight, point) {\n    var roundUp100 = function(d) { return 100*Math.floor(d/100); },\n        labelWidth = roundUp100(labelWidth),\n        chart = window.charts['__uuid__'];\n\n    var tooltipX, tooltipY;\n        var testX = (point.plotX + labelWidth * 0.7 > chart.plotWidth / 2) && (point.plotX - labelWidth * 0.7 < chart.plotWidth / 2);\n        var testY = point.plotY < labelHeight * 0.7;\n\n    if (testX && testY) {\n                tooltipX = chart.plotLeft + (chart.plotWidth - labelWidth) / 2;\n        tooltipY = chart.plotTop + chart.plotHeight - labelHeight;\n    } else {\n                tooltipX = chart.plotLeft + (chart.plotWidth - labelWidth) / 2;\n        tooltipY = chart.plotTop;\n    }\n\n    return {\n        x: tooltipX,\n        y: tooltipY\n    };\n}\n\n"},
    'title': {'text': 'Time series plotted with HighStock'},
    'subtitle': {'text': 'Transparent access to the underlying js lib'},
    'yAxis': {
        'gridLineWidth': 1.0,
        'gridLineDashStyle': 'Dot'},
    'xAxis': {
        'gridLineWidth': 1.0, 
        'gridLineDashStyle': 'Dot'},
}

chart = hc.Chart(height=500, stock = True, options = options, data = data)

chart

# Working with DataFrames

The underlying functions enable to format the pandas Dataframe to fit to the required formats. Thus the Dataframe format enables a lot of convenient features.


df = hc.sample.df_timeseries(N=3, Nb_bd=2000)
df['Cash'] = 1.0+0.02/260
df['Cash'] = df['Cash'].cumprod()

data_2 = hc.build.series(df, visible={'Track3': False})

chart = hc.Chart(height = 500, stock = True, options = options, data = data_2)

chart

# Bar Chart

All sorts of bar charts are available with HighCharts, for more details see their documentation.

data = hc.sample.df_one_idx_several_col()
categories = list(data.index)
data = hc.build.series(data)

for line in data:
    line['data'] = [[sample[0], int(sample[1])] for sample in line['data']]

options = {
    'chart':{
        'type': 'column'
    },
    'title': {'text': 'Basic Bar Chart'},
    'yAxis': {'title': {'text': 'Fruit Consumption'}},
    'xAxis': {'categories': ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']},
}


chart = hc.Chart(height=400, options = options, data = data)

chart

# Pie Chart

Pie charts are also available in ipyhc, as they are in HighCharts.

data = hc.sample.df_one_idx_one_col()

options = {
    'chart':{'type':'pie'},
    'plotOptions':{
        'pie':{
            'showInLedgend':True,
            'dataLabels':{
                'enabled': True
            }
        }
    },
    'title':{'text':'Browser Market Share'}
}

chart = hc.Chart(width = 400, height = 400, options = options, data = data)

chart

# Scatter Chart

df = hc.sample.df_scatter()

options = {
    'chart': {
        'type': 'scatter',
        'zoomType': 'xy'
    },
    'exporting': False,
    'plotOptions':{'scatter':{'marker':  {'radius': 5}}},
    'tooltip':{
        'headerFormat': '<b>Sex: {series.name}</b><br>',
        'pointFormat':  '{point.x} cm, {point.y} kg'
    },
    'legend':{
        'layout': 'vertical',
        'align': 'left',
        'verticalAlign': 'top',
        'x': 100,
        'y': 70,
        'floating': True,
        'borderWidth': 1
    },
    'xAxis':{
        'title': {'text': 'Height (cm)'}
    },
    'yAxis':{
        'title': {'text': 'Weight (kg)'}
    },
    'title': {'text': 'Height Versus Weight of 507 Individuals by Gender'},
    'subtitle': {'text': 'Source: Heinz 2003'}
}

data = hc.build.series_scatter(df, color_column='Sex',
                                   color={'Female': 'rgba(223, 83, 83, .5)',
                                          'Male': 'rgba(119, 152, 191, .5)'})

chart = hc.Chart(width = 700, height = 500, options = options, data = data)

chart