function to create html divs for bar plot. These divs can be embedded in html pages to display the plots.

monitoring.py

import plotly
import plotly.express as px

def generate_div(prediction_distribution):
    """
    function to generate div html tags from model prediction distribution dictionary.

    :param prediction_distribution: dictionary with keys as model name and its values as a dictionary having 
    its classes and values. It should look like:
    {'1.0': {'Class 1': 23,
         'Class 2': 19,
         'Class 3: 40},
    '2.0': {'Category 1': 10,
         'Category 2': 42,
         'Category 3': 23,
         'Category 4': 20,
         },
    '3.0': {'Class A': 10,
         'Class B': 23,
         'Class C': 12,
         }}
    :type prediction_distribution: Dictionary
    :return: html div tags
    :rtype: list of div tags
    """
    divs = []
    for version in prediction_distribution:
        the_dict = {'Intent_categories':[], 'Values':[]}
        the_dict['Intent_categories'] = list(prediction_distribution[version].keys())
        the_dict['Values'] = [prediction_distribution[version][i] for i in the_dict['Intent_categories']]
        fig = px.bar(the_dict, x='Intent_categories', y='Values', color='Values',title="Class prediction distribution for model %s"%version)
        fig.update_layout(uniformtext_minsize=8, uniformtext_mode='hide', xaxis_tickangle=45)
        divs.append(plotly.io.to_html(fig, include_plotlyjs=False, full_html=False))
    return divs