2

I am trying to create a simple charting web app using pygal and flask to chart some financial data I have stored in a mysql database. The data in the DB is hierarchical, and I want the app to start at the top of the hierarchy and allow the user to drill down by simply clicking on the relevant parts of the chart.

I am using flask to display the dynamically generated pygal charts.

Sample DB data:

guid | name | value | parentGuid | Description
------------------------------------------------
1234 | cat1 | 1     | null       | Blah, blah
4567 | cat2 | 55    | null       | asfdsa
8901 | cat3 | 22    | 1234       | asfdsa
5435 | cat4 | 3     | 8901       | afdsa
etc...

I have no problem drilling down the hierarchy using python + sql, but where I'm stumped is how I drill down using links in my pygal chart.

@app.route('/', methods=['GET', 'POST'])
def index(): 
    if request.method == 'POST':
        chart = graph_sub(request.form['guid'])
        return render_template('Graph3.html', chart=chart)
    else:
        chart = graph_main()
        return render_template('Graph3.html', chart=chart)


def graph_main(): 
    """ render svg graph """
    line_chart = pygal.HorizontalBar()
    line_chart.title = 'Root Accounts'
    RootAccts = GetRootAccounts() # Returns a list of lists containing accounts and account data.
    for Acct in RootAccts:  
        line_chart.add({
            'title': Acct[1], # Acct Name
            'tooltip': Acct[4], # Acct description
            'xlink': {'href': '/'} # Hyperlink that I want to pass POST data back to the form.
        }, [{
            'value': Acct[2]), # Acct Value
            'label': Acct[4], # Acct Description
            'xlink': {'href': '/'} # Hyperlink that I want to pass POST data back to the form.
        }])
    return line_chart.render()

def graph_sub(parentGuid):
    ### This works fine if I pass a parent GUID to it
    ### Now the question is how do I pass the guid to it from my pygal chart?
    return line_chart.render()

So when I click on the links embedded in the pygal chart

'xlink': {'href': '/'}

How can I make it redirect back to the same page and pass the GUID of the selected account as POST data? Or is there another way to do this that doesn't involve POST?

The page reloading every time they click something so I'm hoping to keep this as simple as possible without having to involve ajax/java/etc... though if there are no other options I am open to it.

I don't have it coded yet, but there will also be some additional form controls added to the page that will allow the user to set date ranges to control how much data is displayed. I was planning to use POST to pass user input around, but before I get too far down that road, I need to figure out how I can manage this base functionality.

Thoughts?

user3246693
  • 679
  • 11
  • 22
  • I want to do the same. Looks relatively straightforward from the documentation: http://pygal.org/en/stable/documentation/configuration/value.html#links – hum3 Dec 04 '17 at 10:28

0 Answers0