Skip to content

Commit

Permalink
[Doc] Add Arrow Example (#3236)
Browse files Browse the repository at this point in the history
* [Doc] Add Arrow Vector Example

* [Doc] Add Arrow Vector Example

* [Doc] Move arrow vector example to line charts

Co-authored-by: Stefan Binder <binder_stefan@outlook.com>

* Update language

Co-authored-by: Stefan Binder <binder_stefan@outlook.com>

* replace with double quotes

* Fix language as argument syntax example

* showing 2 arrow methods in single chart

* Delete tests/examples_methods_syntax/line_chart_with_arrows.py

* Simplify code a bit

---------

Co-authored-by: Stefan Binder <binder_stefan@outlook.com>
Co-authored-by: Joel Ostblom <joelostblom@users.noreply.github.com>
  • Loading branch information
3 people authored Nov 12, 2023
1 parent f3453f9 commit 65240de
Showing 1 changed file with 65 additions and 0 deletions.
65 changes: 65 additions & 0 deletions tests/examples_arguments_syntax/line_chart_with_arrows.py
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
"""
Line Chart with Arrows
----------------------
This example shows a simple line chart with two types of arrow annotations.
The Unicode character approach is simpler,
while the line plus triangle :ref:`point mark <user-guide-point-marks>` allows for greater flexibility,
such as customizable arrowheads.
"""
# category: line charts
import altair as alt
import numpy as np
import pandas as pd


x = np.linspace(1,7)
data = pd.DataFrame({
"x": x,
"y": np.sin(x),
})

unicode_arrow_with_text = alt.layer(
# Arrow
alt.Chart().mark_text(size=60, align="left", baseline="bottom", fontWeight=100, angle=340).encode(
x=alt.datum(2.8),
y=alt.datum(-0.3),
text=alt.datum("🠃") # Any unicode symbol could be used instead
),
# Text
alt.Chart().mark_text(size=14, align="center", baseline="bottom").encode(
x=alt.datum(1.8),
y=alt.datum(-0.1),
text=alt.datum("decreasing")
)
)

mark_arrow_with_text = alt.layer(
# Arrow line
alt.Chart().mark_line(size=2).encode(
x=alt.datum(5.4),
y=alt.datum(-0.4),
x2=alt.datum(5.9),
y2=alt.datum(0)
),
# Arrow head
alt.Chart().mark_point(shape="triangle", filled=True, fillOpacity=1).encode(
x=alt.datum(5.9),
y=alt.datum(0),
angle=alt.AngleValue(23),
size=alt.SizeValue(100),
color=alt.ColorValue("#000000")
),
# Text
alt.Chart().mark_text(size=14, align="center", baseline="bottom").encode(
x=alt.datum(4.7),
y=alt.datum(-0.3),
text=alt.datum("increasing")
),
)

line_with_points = alt.Chart(data).mark_line(point=True).encode(
x=alt.X("x"),
y=alt.Y("y"),
)

line_with_points + unicode_arrow_with_text + mark_arrow_with_text

0 comments on commit 65240de

Please sign in to comment.