2

How can I make the first image look like the second using matplotlib?

Each "column" from the blue graph represents something like the inverse of corresponding green graph "column". I think this format is informative.

two one

EDIT: This code should give you an idea of what I'm doing.

import tkinter as tk
import numpy as np

from matplotlib.figure import Figure
from matplotlib.font_manager import FontProperties
from matplotlib.backends.backend_tkagg import FigureCanvasTkAgg

infoFrame = tk.Frame(tk.Tk(), width=1200, height=750, padx=5, pady=5)
infoFrame.grid()

graphCanvas = tk.Canvas(infoFrame)
graphCanvas.grid(columnspan=5, rowspan=2, row=1)

infoGraph = Figure(figsize=(7, 6), dpi=100)  
firstGraph = infoGraph.add_subplot(2, 1, 2, axisbg="#9DDEFF")
secondGraph = infoGraph.add_subplot(2, 1, 1, axisbg="#B2F0B2")

entries = ["one", "two"]
types = ["x", "y"]
_tkColors = ["black", "yellow", "magenta", "cyan", "red", "green", "blue"]
index = np.arange(len(types))
width = 0.3
firstLabelData = []
secondLabelData = []
iterator = 0
barData = {'interval': 1, 'data': 
            {'one': {'std': [0.0, 0.0], 'sum': [5, 4], 'mean': [5.0, 4.0]}, 
            'two': {'std': [0.0, 0.0], 'sum': [14, 2], 'mean': [14.0, 2.0]}}}

for entry in entries:
    firstPlot = firstGraph.bar(index+(width*iterator), barData["data"][entry]["sum"], width,
                         color=_tkColors[iterator % len(_tkColors)], yerr=barData["data"][entry]["std"])
    secondPlot = secondGraph.bar(index+(width*iterator), barData["data"][entry]["sum"], width,
                         color=_tkColors[iterator % len(_tkColors)], yerr=barData["data"][entry]["std"])

    firstLabelData.append(firstPlot[0])
    secondLabelData.append(secondPlot[0])

    iterator += 1


firstGraph.text(3.6, 18, "Inverse Graph 1", weight="bold")
firstGraph.set_xlabel("Over " + str(30) + " Iterations")
firstGraph.invert_yaxis()
secondGraph.text(3.5, 18, "Graph 1", weight="bold")

fontP = FontProperties()
fontP.set_size("small")

secondGraph.legend(tuple(firstLabelData), tuple(entries), prop=fontP, loc=2)

graph = FigureCanvasTkAgg(infoGraph, master=graphCanvas)
graph.show()
graph._tkcanvas.pack(side=tk.TOP, expand=1)

infoFrame.mainloop()
Improve this question
5
  • Each "column" from the blue graph represents something like the inverse of corresponding green graph "column". I think this format is informative. Commented Jun 26, 2014 at 1:14
  • 2
    you should include some minimal runnable code of what you have tried (including some synthetic data). I would use axvspan to get the coloring, and then one call to bar with the top and bottom kwargs. Commented Jun 26, 2014 at 1:15
  • ~You did not post relevant code.~ nm, SO bits were refreshing at different rates Commented Jun 26, 2014 at 1:53
  • 1
    It has now gone too far the other way as no one is going to read that much code. (we are like Goldilocks here ;) ) Commented Jun 26, 2014 at 1:55
  • Quite alright. I'll figure it out! Commented Jun 26, 2014 at 1:56

1 Answer 1

Reset to default
2

Something like:

fig, ax = plt.subplots()


ax.set_ylim([-5, 5])
ax.axhspan(0, 5, color='b', alpha=.5, zorder=-5)
ax.axhspan(-5, 0, color='r', alpha=.5, zorder=-5)
for j, c in enumerate(['k', 'y', 'm']):
    t = np.random.rand(10)
    b = -np.random.rand(10)
    h = -b + t
    ax.bar(.3*j + np.arange(10), h, bottom=b,  color=c, width=.3)

This is a little brittle in that the colored backgrounds are finite in the vertical direction. I suspect there is a better way to do half-infinite patches, but I can't think of it off the top of my head.

enter image description here

If you really want to do this with two idependent axes, something like this would probably work:

fig = plt.figure()
top_axes = fig.add_axes([.1, .5, .8, .4], axisbg="#9DDEFF")
bottom_axes = fig.add_axes([.1, .1, .8, .4], sharex=top_axes, axisbg="#B2F0B2")
bottom_axes.invert_yaxis()
top_axes.xaxis.set_visible(False)

for j, c in enumerate(['k', 'y', 'm']):
    b = np.random.rand(10)
    t = np.random.rand(10)
    top_axes.bar(.3*j + np.arange(10), t,  color=c, width=.3)
    bottom_axes.bar(.3*j + np.arange(10), b,  color=c, width=.3)

There is some sillyness going on with the 0 label on the yaxis (because it is being double drawn), but that should not be too hard to fix (might need a fancy formatter).

enter image description here

Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

The data for the top part is completely separate from the data from the bottom (and both are always positive). It is as if top was collected one day and bottom the next. With this in mind, what do you suggest?
ah, I missed the missing negative sign. You could use a formatter to show the absolute value of the ticks.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.