Skip to content

Tweak colors #5063

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
1ucian0 merged 28 commits into from
Sep 28, 2020
Merged

Tweak colors #5063

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
28 commits
Select commit Hold shift + click to select a range
5fa5898
Tweak colors to match new IQX colors
galeinston Sep 14, 2020
660bd00
Testing push commit
enavarro51 Sep 17, 2020
08fa8a9
Merge branch 'master' into Tweak_Colors_IQX
galeinston Sep 17, 2020
149641b
Update qcstyle to provide 3 classes for mpl
galeinston Sep 22, 2020
fc86dcf
Merge branch 'Tweak_Colors_IQX' of https://github.com/galeinston/qisk…
galeinston Sep 22, 2020
11bbd2b
Merge branch 'master' into Tweak_Colors_IQX
galeinston Sep 22, 2020
e559e77
Adjust style and color options
enavarro51 Sep 22, 2020
c994f70
Minor qcstyle changes
enavarro51 Sep 22, 2020
befb689
Allow str or tuple for displaycolor and update docs
enavarro51 Sep 22, 2020
394e6fa
Merge branch 'master' into Tweak_Colors_IQX
enavarro51 Sep 22, 2020
2971c46
Doc string changes
enavarro51 Sep 23, 2020
14456d8
Further update docs
enavarro51 Sep 23, 2020
bcf09e6
Merge branch 'master' into Tweak_Colors_IQX
enavarro51 Sep 23, 2020
4221874
Add name in style param to choose ipx or bw and add binder test
enavarro51 Sep 23, 2020
fc7709d
Add style to test and fix typos
enavarro51 Sep 23, 2020
49a649f
Rework style name and add name to style docs
enavarro51 Sep 24, 2020
80fbd86
Add reno
enavarro51 Sep 24, 2020
2117b78
Minor name mods
enavarro51 Sep 24, 2020
70f7034
Merge branch 'master' into Tweak_Colors_IQX
enavarro51 Sep 24, 2020
25bd9bb
Fix indent
enavarro51 Sep 24, 2020
4fd55bf
Merge branch 'Tweak_Colors_IQX' of https://github.com/galeinston/qisk…
enavarro51 Sep 24, 2020
25798af
Merge branch 'master' into Tweak_Colors_IQX
enavarro51 Sep 26, 2020
9e9e448
Fix style selection
enavarro51 Sep 26, 2020
84edcf5
Merge branch 'master' into Tweak_Colors_IQX
enavarro51 Sep 27, 2020
498bee4
Merge branch 'Tweak_Colors_IQX' of https://github.com/galeinston/qisk…
enavarro51 Sep 27, 2020
5233a8e
Fix lint and imports
enavarro51 Sep 27, 2020
cb57699
Lint again
enavarro51 Sep 27, 2020
3fa5787
Merge branch 'master' into Tweak_Colors_IQX
enavarro51 Sep 28, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
71 changes: 48 additions & 23 deletions qiskit/circuit/quantumcircuit.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1217,6 +1217,9 @@ def draw(self, output=None, scale=None, filename=None, style=None,
below:

Args:
name (str): The name of the style. The name can be set to 'iqx',
'bw', or 'default'. This overrides the setting in the
'~/.qiskit/settings.conf' file.
textcolor (str): The color code to use for text. Defaults to
`'#000000'`
subtextcolor (str): The color code to use for subtext. Defaults to
Expand Down Expand Up @@ -1262,33 +1265,55 @@ def draw(self, output=None, scale=None, filename=None, style=None,
You must specify all the necessary values if using this. There
is no provision for passing an incomplete dict in.
displaycolor (dict): The color codes to use for each circuit
element. The default values are::
element in the form (gate_color, text_color).
The default values are::

{
'id': '#F0E442',
'u0': '#E7AB3B',
'u1': '#E7AB3B',
'u2': '#E7AB3B',
'u3': '#E7AB3B',
'x': '#58C698',
'y': '#58C698',
'z': '#58C698',
'h': '#70B7EB',
's': '#E0722D',
'sdg': '#E0722D',
't': '#E0722D',
'tdg': '#E0722D',
'rx': '#ffffff',
'ry': '#ffffff',
'rz': '#ffffff',
'reset': '#D188B4',
'target': '#70B7EB',
'meas': '#D188B4'
'u1': ('#FA74A6', '#000000'),
'u2': ('#FA74A6', '#000000'),
'u3': ('#FA74A6', '#000000'),
'id': ('#05BAB6', '#000000'),
'x': ('#05BAB6', '#000000'),
'y': ('#05BAB6', '#000000'),
'z': ('#05BAB6', '#000000'),
'h': ('#6FA4FF', '#000000'),
'cx': ('#6FA4FF', '#000000'),
'cy': ('#6FA4FF', '#000000'),
'cz': ('#6FA4FF', '#000000'),
'swap': ('#6FA4FF', '#000000'),
's': ('#6FA4FF', '#000000'),
'sdg': ('#6FA4FF', '#000000'),
'dcx': ('#6FA4FF', '#000000'),
'iswap': ('#6FA4FF', '#000000'),
't': ('#BB8BFF', '#000000'),
'tdg': ('#BB8BFF', '#000000'),
'r': ('#BB8BFF', '#000000'),
'rx': ('#BB8BFF', '#000000'),
'ry': ('#BB8BFF', '#000000'),
'rz': ('#BB8BFF', '#000000'),
'rxx': ('#BB8BFF', '#000000'),
'ryy': ('#BB8BFF', '#000000'),
'rzx': ('#BB8BFF', '#000000'),
'reset': ('#000000', #FFFFFF'),
'target': ('#FFFFFF, '#FFFFFF'),
'measure': ('#000000', '#FFFFFF'),
'ccx': ('#BB8BFF', '#000000'),
'cdcx': ('#BB8BFF', '#000000'),
'ccdcx': ('#BB8BFF', '#000000'),
'cswap': ('#BB8BFF', '#000000'),
'ccswap': ('#BB8BFF', '#000000'),
'mcx': ('#BB8BFF', '#000000'),
'mcx_gray': ('#BB8BFF', '#000000),
'u': ('#BB8BFF', '#000000'),
'p': ('#BB8BFF', '#000000'),
'sx': ('#BB8BFF', '#000000'),
'sxdg': ('#BB8BFF', '#000000')
}

Also, just like `displaytext` there is no provision for an
incomplete dict passed in.

Colors can also be entered without the text color, such as
'u1': '#FA74A6', in which case the text color will always
be 'gatetextcolor'. The 'displaycolor' dict can contain any
number of elements from one to the entire dict above.
latexdrawerstyle (bool): When set to True, enable LaTeX mode, which
will draw gates like the `latex` output modes.
usepiformat (bool): When set to True, use radians for output.
Expand Down
4 changes: 2 additions & 2 deletions qiskit/user_config.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -69,10 +69,10 @@ def read_config_file(self):
'circuit_mpl_style',
fallback=None)
if circuit_mpl_style:
if circuit_mpl_style not in ['default', 'bw']:
if circuit_mpl_style not in ['default', 'iqx', 'bw']:
raise exceptions.QiskitUserConfigError(
"%s is not a valid mpl circuit style. Must be "
"either 'default' or 'bw'"
"either 'default', 'iqx', or bw'"
% circuit_mpl_style)
self.settings['circuit_mpl_style'] = circuit_mpl_style
# Parse transpile_optimization_level
Expand Down
73 changes: 49 additions & 24 deletions qiskit/visualization/circuit_visualization.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -157,6 +157,9 @@ def circuit_drawer(circuit,
output. The options available in the style dict are defined below:

Args:
name (str): The name of the style. The name can be set to 'iqx',
'bw', or 'default'. This overrides the setting in the
'~/.qiskit/settings.conf' file.
textcolor (str): The color code to use for text. Defaults to
`'#000000'`
subtextcolor (str): The color code to use for subtext. Defaults to
Expand Down Expand Up @@ -200,34 +203,56 @@ def circuit_drawer(circuit,

You must specify all the necessary values if using this. There is
no provision for passing an incomplete dict in.
displaycolor (dict):
The color codes to use for each circuit element. The default values are::
displaycolor (dict): The color codes to use for each circuit
element in the form (gate_color, text_color).
The default values are::

{
'id': '#F0E442',
'u0': '#E7AB3B',
'u1': '#E7AB3B',
'u2': '#E7AB3B',
'u3': '#E7AB3B',
'x': '#58C698',
'y': '#58C698',
'z': '#58C698',
'h': '#70B7EB',
's': '#E0722D',
'sdg': '#E0722D',
't': '#E0722D',
'tdg': '#E0722D',
'rx': '#ffffff',
'ry': '#ffffff',
'rz': '#ffffff',
'reset': '#D188B4',
'target': '#70B7EB',
'meas': '#D188B4'
'u1': ('#FA74A6', '#000000'),
'u2': ('#FA74A6', '#000000'),
'u3': ('#FA74A6', '#000000'),
'id': ('#05BAB6', '#000000'),
'x': ('#05BAB6', '#000000'),
'y': ('#05BAB6', '#000000'),
'z': ('#05BAB6', '#000000'),
'h': ('#6FA4FF', '#000000'),
'cx': ('#6FA4FF', '#000000'),
'cy': ('#6FA4FF', '#000000'),
'cz': ('#6FA4FF', '#000000'),
'swap': ('#6FA4FF', '#000000'),
's': ('#6FA4FF', '#000000'),
'sdg': ('#6FA4FF', '#000000'),
'dcx': ('#6FA4FF', '#000000'),
'iswap': ('#6FA4FF', '#000000'),
't': ('#BB8BFF', '#000000'),
'tdg': ('#BB8BFF', '#000000'),
'r': ('#BB8BFF', '#000000'),
'rx': ('#BB8BFF', '#000000'),
'ry': ('#BB8BFF', '#000000'),
'rz': ('#BB8BFF', '#000000'),
'rxx': ('#BB8BFF', '#000000'),
'ryy': ('#BB8BFF', '#000000'),
'rzx': ('#BB8BFF', '#000000'),
'reset': ('#000000', #FFFFFF'),
'target': ('#FFFFFF, '#FFFFFF'),
'measure': ('#000000', '#FFFFFF'),
'ccx': ('#BB8BFF', '#000000'),
'cdcx': ('#BB8BFF', '#000000'),
'ccdcx': ('#BB8BFF', '#000000'),
'cswap': ('#BB8BFF', '#000000'),
'ccswap': ('#BB8BFF', '#000000'),
'mcx': ('#BB8BFF', '#000000'),
'mcx_gray': ('#BB8BFF', '#000000),
'u': ('#BB8BFF', '#000000'),
'p': ('#BB8BFF', '#000000'),
'sx': ('#BB8BFF', '#000000'),
'sxdg': ('#BB8BFF', '#000000')
}

Also, just like `displaytext` there is no provision for an
incomplete dict passed in.

Colors can also be entered without the text color, such as
'u1': '#FA74A6', in which case the text color will always
be 'gatetextcolor'. The 'displaycolor' dict can contain any
number of elements from one to the entire dict above.
latexdrawerstyle (bool): When set to True enable latex mode which will
draw gates like the `latex` output modes.
usepiformat (bool): When set to True use radians for output
Expand Down
90 changes: 60 additions & 30 deletions qiskit/visualization/matplotlib.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,8 +40,8 @@
HAS_PYLATEX = False

from qiskit.circuit import ControlledGate
from qiskit.visualization.qcstyle import DefaultStyle, IQXStyle, BWStyle
from qiskit.circuit import Delay
from qiskit.visualization.qcstyle import DefaultStyle, BWStyle
from qiskit import user_config
from qiskit.circuit.tools.pi_check import pi_check

Expand Down Expand Up @@ -140,17 +140,35 @@ def __init__(self, qregs, cregs, ops,
'xmax': 0,
'ymax': 0,
}
config = user_config.get_config()
if config and (style is None):
config_style = config.get('circuit_mpl_style', 'default')
if config_style == 'default':
self._style = DefaultStyle()
elif config_style == 'bw':
if isinstance(style, dict) and 'name' in style.keys():
if style['name'] == 'iqx':
self._style = IQXStyle()
elif style['name'] == 'bw':
self._style = BWStyle()
elif style is False:
self._style = BWStyle()
else:
self._style = DefaultStyle()
else:
self._style = DefaultStyle()
config = user_config.get_config()
if config:
config_style = config.get('circuit_mpl_style', 'default')
if config_style == 'iqx':
self._style = IQXStyle()
elif config_style == 'bw':
self._style = BWStyle()
else:
self._style = DefaultStyle()
elif style is False:
self._style = BWStyle()
else:
self._style = DefaultStyle()

if style:
if isinstance(style, dict):
self._style.set_style(style)
elif isinstance(style, str):
with open(style) as infile:
dic = json.load(infile)
self._style.set_style(dic)

self.plot_barriers = plot_barriers
self.reverse_bits = reverse_bits
Expand All @@ -165,14 +183,6 @@ def __init__(self, qregs, cregs, ops,
else:
self.cregbundle = cregbundle

if style:
if isinstance(style, dict):
self._style.set_style(style)
elif isinstance(style, str):
with open(style) as infile:
dic = json.load(infile)
self._style.set_style(dic)

if ax is None:
self.return_fig = True
self.figure = plt.figure()
Expand Down Expand Up @@ -337,21 +347,40 @@ def _get_gate_ctrl_text(self, op):
return gate_text, ctrl_text

def _get_colors(self, op):
base_name = None if not hasattr(op.op, 'base_gate') else op.op.base_gate.name
if op.name in self._style.dispcol:
fc = self._style.dispcol[op.name]
color = self._style.dispcol[op.name]
# Backward compatibility for style dict using 'displaycolor' with
# gate color and no text color, so test for str first
if isinstance(color, str):
fc = color
gt = self._style.gt
else:
fc = color[0]
gt = color[1]
# Treat special case of classical gates in iqx style by making all
# controlled gates of x, dcx, and swap the classical gate color
elif self._style.name == 'iqx' and base_name in ['x', 'dcx', 'swap']:
color = self._style.dispcol[base_name]
if isinstance(color, str):
fc = color
gt = self._style.gt
else:
fc = color[0]
gt = color[1]
else:
fc = self._style.gc
if self._style.name != 'bw':
ec = fc
lc = fc
else:
gt = self._style.gt

if self._style.name == 'bw':
ec = self._style.edge_color
lc = self._style.lc
if op.name == 'reset':
gt = self._style.not_gate_lc
else:
gt = self._style.gt
return fc, ec, gt, self._style.tc, self._style.sc, lc
ec = fc
lc = fc
# Subtext needs to be same color as gate text
sc = gt
return fc, ec, gt, self._style.tc, sc, lc

def _multiqubit_gate(self, xy, fc=None, ec=None, gt=None, sc=None, text='', subtext=''):
xpos = min([x[0] for x in xy])
Expand Down Expand Up @@ -489,7 +518,7 @@ def _ctrl_qubit(self, xy, fc=None, ec=None, tc=None, text='', text_top=None):
# display the control label at the top or bottom if there is one
if text_top is True:
self.ax.text(xpos, ypos + 0.7 * HIG, text, ha='center', va='top',
fontsize=self._style.sfs, color=self._style.tc,
fontsize=self._style.sfs, color=tc,
clip_on=True, zorder=PORDER_TEXT)
elif text_top is False:
self.ax.text(xpos, ypos - 0.3 * HIG, text, ha='center', va='top',
Expand Down Expand Up @@ -923,8 +952,9 @@ def _draw_ops(self, verbose=False):
num_ctrl_qubits = op.op.num_ctrl_qubits
self._set_ctrl_bits(op.op.ctrl_state, num_ctrl_qubits,
q_xy, ec=ec, tc=tc, text=ctrl_text, qargs=op.qargs)
self._x_tgt_qubit(q_xy[num_ctrl_qubits], ec=ec,
ac=self._style.dispcol['target'])
tgt_color = self._style.dispcol['target']
tgt = tgt_color if isinstance(tgt_color, str) else tgt_color[0]
self._x_tgt_qubit(q_xy[num_ctrl_qubits], ec=ec, ac=tgt)
self._line(qreg_b, qreg_t, lc=lc)

# cz gate
Expand Down
Loading