fix up overlays, part 2:

- say what layer is active when zoomed in
- zoom out after opening an overlay, if needed
- sadly, scrap the heatmap icons for now
[rebuild]
This commit is contained in:
Dustin Carlino 2020-03-20 12:31:08 -07:00
parent 7368f9ef24
commit 469c11e532
8 changed files with 83 additions and 197 deletions

View File

@ -137,11 +137,6 @@ b0a3a08cac236734be96330179c40be2 data/input/google_transit_2018_18_08/trips.txt
6ee699d3fdc218e5be3906ee90160a1d data/input/google_transit_2018_18_08/fare_attributes.txt
d7587f76ed2d514d9f925c8b60b30153 data/input/google_transit_2018_18_08/stops.txt
3d8b080487e096ef417038739acecea5 data/input/google_transit_2018_18_08/agency.txt
bbd7d9c86c3360807a7326c3d07d864c data/system/assets/layers/parking_avail.svg
676e4f938ef8ebe1395c3ee34ac0dd4b data/system/assets/layers/throughput.svg
8e0184126ba8a70da58a1f57dd2661b6 data/system/assets/layers/bike_network.svg
e9a1bcaa265cfb89d276099f491ad4a6 data/system/assets/layers/intersection_delay.svg
92b1f47816f3f8e4a14c630ada8e1141 data/system/assets/layers/bus_network.svg
e4d10fa4a66453b7097d906e4616e26b data/system/assets/meters/car.svg
9d747979fdc362ac6df0af3c3bbffd15 data/system/assets/meters/bus.svg
f7facfb678770c416e5529b2b2d066e5 data/system/assets/meters/pedestrian.svg

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 9.1 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 8.0 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 12 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 11 KiB

View File

@ -1,21 +0,0 @@
<svg width="93" height="124" viewBox="0 0 93 124" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="8" y="1" width="84" height="84" rx="5" stroke="#F2F2F2" stroke-width="2"/>
<g clip-path="url(#clip0)">
<path d="M15 100.523L137.458 39" stroke="#F2F2F2" stroke-width="1.7" stroke-dasharray="12 8"/>
<path d="M-0.216553 74.0254L122.242 12.502" stroke="#F2F2F2" stroke-width="1.76622"/>
<path d="M1.54956 76.3799L124.008 14.8564" stroke="#F2F2F2" stroke-width="1.76622"/>
<path d="M-21 55.5234L101.458 -6" stroke="#F2F2F2" stroke-width="1.7" stroke-dasharray="12 8"/>
<path d="M21.3773 41.134L20.9033 41.9605C19.6232 44.1926 19.5492 46.9183 20.7062 49.2166C21.8632 51.5149 24.0967 53.0789 26.6521 53.3802L27.5984 53.4918C29.1554 53.6753 30.732 53.3974 32.1323 52.6924L58.4931 39.422C61.4529 37.932 62.6444 34.3247 61.1544 31.3649L59.1378 27.3591C57.6478 24.3993 54.0405 23.2078 51.0807 24.6978L24.7199 37.9682C23.3196 38.6731 22.1572 39.774 21.3773 41.134Z" fill="#F2F2F2"/>
<path d="M52.4638 72.4374L52.9358 71.6097C54.2103 69.3744 54.2776 66.6486 53.1149 64.3531C51.9522 62.0577 49.7149 60.4992 47.1587 60.2043L46.2122 60.0951C44.6548 59.9154 43.0788 60.1972 41.6803 60.9056L15.3524 74.2413C12.3963 75.7386 11.2137 79.3488 12.7111 82.305L14.7375 86.3057C16.2349 89.2619 19.8451 90.4444 22.8012 88.9471L49.1291 75.6115C50.5277 74.9031 51.6873 73.7993 52.4638 72.4374Z" fill="#F2F2F2"/>
<path d="M118.464 70.4374L118.936 69.6097C120.21 67.3744 120.278 64.6486 119.115 62.3531C117.952 60.0577 115.715 58.4992 113.159 58.2043L112.212 58.0951C110.655 57.9154 109.079 58.1972 107.68 58.9056L81.3524 72.2413C78.3963 73.7386 77.2137 77.3488 78.7111 80.305L80.7375 84.3057C82.2349 87.2619 85.8451 88.4444 88.8012 86.9471L115.129 73.6115C116.528 72.9031 117.687 71.7993 118.464 70.4374Z" fill="#F2F2F2"/>
<path d="M-23.6227 64.134L-24.0967 64.9605C-25.3768 67.1926 -25.4508 69.9183 -24.2938 72.2166C-23.1368 74.5149 -20.9033 76.0789 -18.3479 76.3802L-17.4016 76.4918C-15.8446 76.6753 -14.268 76.3974 -12.8677 75.6924L13.4931 62.422C16.4529 60.932 17.6444 57.3247 16.1544 54.3649L14.1378 50.3591C12.6478 47.3993 9.04051 46.2078 6.0807 47.6978L-20.2801 60.9682C-21.6804 61.6731 -22.8428 62.774 -23.6227 64.134Z" fill="#F2F2F2"/>
<path d="M65.3773 19.134L64.9033 19.9605C63.6232 22.1926 63.5492 24.9183 64.7062 27.2166C65.8632 29.5149 68.0967 31.0789 70.6521 31.3802L71.5984 31.4918C73.1554 31.6753 74.732 31.3974 76.1323 30.6924L102.493 17.422C105.453 15.932 106.644 12.3247 105.154 9.36488L103.138 5.35909C101.648 2.39928 98.0405 1.20777 95.0807 2.69778L68.7199 15.9682C67.3196 16.6731 66.1572 17.774 65.3773 19.134Z" fill="#F2F2F2"/>
<path d="M23.3773 9.13398L22.9033 9.96052C21.6232 12.1926 21.5492 14.9183 22.7062 17.2166C23.8632 19.5149 26.0967 21.0789 28.6521 21.3802L29.5984 21.4918C31.1554 21.6753 32.732 21.3974 34.1323 20.6924L60.4931 7.42202C63.4529 5.932 64.6444 2.3247 63.1544 -0.635117L61.1378 -4.64091C59.6478 -7.60072 56.0405 -8.79223 53.0807 -7.30222L26.7199 5.96818C25.3196 6.67313 24.1572 7.77398 23.3773 9.13398Z" fill="#F2F2F2"/>
</g>
<path d="M10.3271 108.592H6.21387V120H4.53516V108.592H0.430664V107.203H10.3271V108.592ZM13.5967 111.642C14.3174 110.757 15.2549 110.314 16.4092 110.314C18.4189 110.314 19.4326 111.448 19.4502 113.716V120H17.8242V113.707C17.8184 113.021 17.6602 112.515 17.3496 112.187C17.0449 111.858 16.5674 111.694 15.917 111.694C15.3896 111.694 14.9268 111.835 14.5283 112.116C14.1299 112.397 13.8193 112.767 13.5967 113.224V120H11.9707V106.5H13.5967V111.642ZM26.4814 111.949C26.2354 111.908 25.9688 111.888 25.6816 111.888C24.6152 111.888 23.8916 112.342 23.5107 113.25V120H21.8848V110.49H23.4668L23.4932 111.589C24.0264 110.739 24.7822 110.314 25.7607 110.314C26.0771 110.314 26.3174 110.355 26.4814 110.438V111.949ZM27.3779 115.157C27.3779 114.226 27.5596 113.388 27.9229 112.644C28.292 111.899 28.8018 111.325 29.4521 110.921C30.1084 110.517 30.8555 110.314 31.6934 110.314C32.9883 110.314 34.0342 110.763 34.8311 111.659C35.6338 112.556 36.0352 113.748 36.0352 115.236V115.351C36.0352 116.276 35.8564 117.108 35.499 117.847C35.1475 118.579 34.6406 119.15 33.9785 119.561C33.3223 119.971 32.5664 120.176 31.7109 120.176C30.4219 120.176 29.376 119.728 28.5732 118.831C27.7764 117.935 27.3779 116.748 27.3779 115.271V115.157ZM29.0127 115.351C29.0127 116.405 29.2559 117.252 29.7422 117.891C30.2344 118.529 30.8906 118.849 31.7109 118.849C32.5371 118.849 33.1934 118.526 33.6797 117.882C34.166 117.231 34.4092 116.323 34.4092 115.157C34.4092 114.114 34.1602 113.271 33.6621 112.626C33.1699 111.976 32.5137 111.65 31.6934 111.65C30.8906 111.65 30.2432 111.97 29.751 112.608C29.2588 113.247 29.0127 114.161 29.0127 115.351ZM43.9453 119.06C43.3125 119.804 42.3838 120.176 41.1592 120.176C40.1455 120.176 39.3721 119.883 38.8389 119.297C38.3115 118.705 38.0449 117.832 38.0391 116.678V110.49H39.665V116.634C39.665 118.075 40.251 118.796 41.4229 118.796C42.665 118.796 43.4912 118.333 43.9014 117.407V110.49H45.5273V120H43.9805L43.9453 119.06ZM47.6191 115.166C47.6191 113.684 47.9619 112.506 48.6475 111.633C49.333 110.754 50.2412 110.314 51.3721 110.314C52.5322 110.314 53.4375 110.725 54.0879 111.545L54.167 110.49H55.6523V119.771C55.6523 121.002 55.2861 121.972 54.5537 122.681C53.8271 123.39 52.8486 123.744 51.6182 123.744C50.9326 123.744 50.2617 123.598 49.6055 123.305C48.9492 123.012 48.4482 122.61 48.1025 122.101L48.9463 121.125C49.6436 121.986 50.4961 122.417 51.5039 122.417C52.2949 122.417 52.9102 122.194 53.3496 121.749C53.7949 121.304 54.0176 120.677 54.0176 119.868V119.051C53.3672 119.801 52.4795 120.176 51.3545 120.176C50.2412 120.176 49.3389 119.728 48.6475 118.831C47.9619 117.935 47.6191 116.713 47.6191 115.166ZM49.2539 115.351C49.2539 116.423 49.4736 117.267 49.9131 117.882C50.3525 118.491 50.9678 118.796 51.7588 118.796C52.7842 118.796 53.5371 118.33 54.0176 117.398V113.057C53.5195 112.148 52.7725 111.694 51.7764 111.694C50.9854 111.694 50.3672 112.002 49.9219 112.617C49.4766 113.232 49.2539 114.144 49.2539 115.351ZM59.7393 111.642C60.46 110.757 61.3975 110.314 62.5518 110.314C64.5615 110.314 65.5752 111.448 65.5928 113.716V120H63.9668V113.707C63.9609 113.021 63.8027 112.515 63.4922 112.187C63.1875 111.858 62.71 111.694 62.0596 111.694C61.5322 111.694 61.0693 111.835 60.6709 112.116C60.2725 112.397 59.9619 112.767 59.7393 113.224V120H58.1133V106.5H59.7393V111.642ZM76.0605 115.351C76.0605 116.798 75.7295 117.964 75.0674 118.849C74.4053 119.733 73.5088 120.176 72.3779 120.176C71.2236 120.176 70.3154 119.81 69.6533 119.077V123.656H68.0273V110.49H69.5127L69.5918 111.545C70.2539 110.725 71.1738 110.314 72.3516 110.314C73.4941 110.314 74.3965 110.745 75.0586 111.606C75.7266 112.468 76.0605 113.666 76.0605 115.201V115.351ZM74.4346 115.166C74.4346 114.094 74.2061 113.247 73.749 112.626C73.292 112.005 72.665 111.694 71.8682 111.694C70.8838 111.694 70.1455 112.131 69.6533 113.004V117.548C70.1396 118.415 70.8838 118.849 71.8857 118.849C72.665 118.849 73.2832 118.541 73.7402 117.926C74.2031 117.305 74.4346 116.385 74.4346 115.166ZM84.0059 119.06C83.373 119.804 82.4443 120.176 81.2197 120.176C80.2061 120.176 79.4326 119.883 78.8994 119.297C78.3721 118.705 78.1055 117.832 78.0996 116.678V110.49H79.7256V116.634C79.7256 118.075 80.3115 118.796 81.4834 118.796C82.7256 118.796 83.5518 118.333 83.9619 117.407V110.49H85.5879V120H84.041L84.0059 119.06ZM90.2725 108.188V110.49H92.0479V111.747H90.2725V117.645C90.2725 118.025 90.3516 118.312 90.5098 118.506C90.668 118.693 90.9375 118.787 91.3184 118.787C91.5059 118.787 91.7637 118.752 92.0918 118.682V120C91.6641 120.117 91.248 120.176 90.8438 120.176C90.1172 120.176 89.5693 119.956 89.2002 119.517C88.8311 119.077 88.6465 118.453 88.6465 117.645V111.747H86.915V110.49H88.6465V108.188H90.2725Z" fill="#F2F2F2"/>
<defs>
<clipPath id="clip0">
<rect x="7" width="86" height="86" rx="6" fill="white"/>
</clipPath>
</defs>
</svg>

Before

Width:  |  Height:  |  Size: 7.7 KiB

View File

@ -7,7 +7,8 @@ use crate::render::MIN_ZOOM_FOR_DETAIL;
use abstutil::clamp;
use ezgui::{
hotkey, Btn, Color, Composite, EventCtx, Filler, GeomBatch, GfxCtx, HorizontalAlignment, Key,
Line, ManagedWidget, Outcome, RewriteColor, ScreenDims, ScreenPt, Text, VerticalAlignment,
Line, ManagedWidget, Outcome, RewriteColor, ScreenDims, ScreenPt, Text, TextExt,
VerticalAlignment,
};
use geom::{Circle, Distance, Polygon, Pt2D, Ring};
@ -415,5 +416,24 @@ fn make_viz_panel(ctx: &mut EventCtx, app: &App) -> ManagedWidget {
.centered_cross(),
);
}
if ctx.canvas.cam_zoom >= MIN_ZOOM_FOR_DETAIL {
if let Some(name) = app.overlay.zoomed_name() {
// TODO Should the full legend have this icon too?
col.insert(
0,
ManagedWidget::row(vec![
ManagedWidget::draw_svg_transform(
ctx,
"../data/system/assets/tools/layers.svg",
RewriteColor::ChangeAll(Color::BLUE),
)
.margin(5),
name.draw_text(ctx),
]),
);
}
}
ManagedWidget::col(col).bg(colors::PANEL_BG).padding(5)
}

View File

@ -248,74 +248,34 @@ impl Overlays {
}
pub fn change_overlays(ctx: &mut EventCtx, app: &App) -> Option<Transition> {
// TODO Icons again, after some work
let mut choices = vec![
Btn::text_fg("None").build_def(ctx, hotkey(Key::N)),
Btn::text_fg("map edits").build_def(ctx, hotkey(Key::E)),
Btn::text_fg("worst traffic jams").build_def(ctx, hotkey(Key::G)),
Btn::text_fg("elevation").build_def(ctx, hotkey(Key::S)),
Btn::svg(
"../data/system/assets/layers/parking_avail.svg",
RewriteColor::Change(Color::hex("#F2F2F2"), colors::HOVERING),
)
.build(ctx, "parking availability", hotkey(Key::P)),
// TODO old button
Btn::svg(
"../data/system/assets/layers/intersection_delay.svg",
RewriteColor::Change(Color::hex("#F2F2F2"), colors::HOVERING),
)
.build(ctx, "delay", hotkey(Key::I)),
Btn::svg(
"../data/system/assets/layers/throughput.svg",
RewriteColor::Change(Color::hex("#F2F2F2"), colors::HOVERING),
)
.build(ctx, "throughput", hotkey(Key::T)),
Btn::svg(
"../data/system/assets/layers/bike_network.svg",
RewriteColor::Change(Color::hex("#F2F2F2"), colors::HOVERING),
)
.build(ctx, "bike network", hotkey(Key::B)),
Btn::svg(
"../data/system/assets/layers/bus_network.svg",
RewriteColor::Change(Color::hex("#F2F2F2"), colors::HOVERING),
)
.build(ctx, "bus network", hotkey(Key::U)),
Btn::text_fg("parking availability").build_def(ctx, hotkey(Key::P)),
Btn::text_fg("delay").build_def(ctx, hotkey(Key::I)),
Btn::text_fg("throughput").build_def(ctx, hotkey(Key::T)),
Btn::text_fg("bike network").build_def(ctx, hotkey(Key::B)),
Btn::text_fg("bus network").build_def(ctx, hotkey(Key::U)),
];
// TODO Grey out the inactive SVGs, and add the green checkmark
if let Some((find, replace)) = match app.overlay {
Overlays::Inactive => Some(("None", Button::inactive_button(ctx, "None"))),
Overlays::ParkingAvailability(_, _) => Some((
"parking availability",
ManagedWidget::draw_svg(ctx, "../data/system/assets/layers/parking_avail.svg"),
)),
Overlays::WorstDelay(_, _) => Some((
"delay",
ManagedWidget::draw_svg(ctx, "../data/system/assets/layers/intersection_delay.svg"),
)),
Overlays::TrafficJams(_, _) => Some((
"worst traffic jams",
Button::inactive_button(ctx, "worst traffic jams"),
)),
Overlays::CumulativeThroughput(_, _) => Some((
"throughput",
ManagedWidget::draw_svg(ctx, "../data/system/assets/layers/throughput.svg"),
)),
Overlays::BikeNetwork(_) => Some((
"bike network",
ManagedWidget::draw_svg(ctx, "../data/system/assets/layers/bike_network.svg"),
)),
Overlays::BusNetwork(_) => Some((
"bus network",
ManagedWidget::draw_svg(ctx, "../data/system/assets/layers/bus_network.svg"),
)),
Overlays::Elevation(_, _) => {
Some(("elevation", Button::inactive_button(ctx, "elevation")))
}
Overlays::Edits(_) => Some(("map edits", Button::inactive_button(ctx, "map edits"))),
if let Some(name) = match app.overlay {
Overlays::Inactive => Some("None"),
Overlays::ParkingAvailability(_, _) => Some("parking availability"),
Overlays::WorstDelay(_, _) => Some("delay"),
Overlays::TrafficJams(_, _) => Some("worst traffic jams"),
Overlays::CumulativeThroughput(_, _) => Some("throughput"),
Overlays::BikeNetwork(_) => Some("bike network"),
Overlays::BusNetwork(_) => Some("bus network"),
Overlays::Elevation(_, _) => Some("elevation"),
Overlays::Edits(_) => Some("map edits"),
_ => None,
} {
for btn in &mut choices {
if btn.is_btn(&find) {
*btn = replace.outline(2.0, Color::GREEN);
if btn.is_btn(name) {
*btn = Button::inactive_button(ctx, name).outline(2.0, Color::GREEN);
break;
}
}
@ -330,13 +290,14 @@ impl Overlays {
.build(ctx, "close", hotkey(Key::Escape))
.align_right(),
]),
ManagedWidget::row(choices).flex_wrap(ctx, 20),
ManagedWidget::row(choices.into_iter().map(|x| x.margin(5)).collect())
.flex_wrap(ctx, 30),
])
.bg(colors::PANEL_BG)
.outline(10.0, Color::WHITE)
.padding(10),
)
.max_size_percent(30, 50)
.max_size_percent(35, 50)
.build(ctx),
)
.cb("close", Box::new(|_, _| Some(Transition::Pop)))
@ -351,60 +312,80 @@ impl Overlays {
"parking availability",
Box::new(|ctx, app| {
app.overlay = Overlays::parking_availability(ctx, app);
Some(Transition::Pop)
Some(maybe_unzoom(ctx, app))
}),
)
.maybe_cb(
"delay",
Box::new(|ctx, app| {
app.overlay = Overlays::worst_delay(ctx, app);
Some(Transition::Pop)
Some(maybe_unzoom(ctx, app))
}),
)
.maybe_cb(
"worst traffic jams",
Box::new(|ctx, app| {
app.overlay = Overlays::traffic_jams(ctx, app);
Some(Transition::Pop)
Some(maybe_unzoom(ctx, app))
}),
)
.maybe_cb(
"throughput",
Box::new(|ctx, app| {
app.overlay = Overlays::cumulative_throughput(ctx, app);
Some(Transition::Pop)
Some(maybe_unzoom(ctx, app))
}),
)
.maybe_cb(
"bike network",
Box::new(|ctx, app| {
app.overlay = Overlays::bike_network(ctx, app);
Some(Transition::Pop)
Some(maybe_unzoom(ctx, app))
}),
)
.maybe_cb(
"bus network",
Box::new(|ctx, app| {
app.overlay = Overlays::bus_network(ctx, app);
Some(Transition::Pop)
Some(maybe_unzoom(ctx, app))
}),
)
.maybe_cb(
"elevation",
Box::new(|ctx, app| {
app.overlay = Overlays::elevation(ctx, app);
Some(Transition::Pop)
Some(maybe_unzoom(ctx, app))
}),
)
.maybe_cb(
"map edits",
Box::new(|ctx, app| {
app.overlay = Overlays::map_edits(ctx, app);
Some(Transition::Pop)
Some(maybe_unzoom(ctx, app))
}),
);
Some(Transition::Push(ManagedGUIState::over_map(c)))
}
// Only for those hidden when zoomed in
pub fn zoomed_name(&self) -> Option<&'static str> {
match self {
Overlays::Inactive => None,
Overlays::ParkingAvailability(_, _) => Some("parking availability"),
Overlays::WorstDelay(_, _) => Some("delay"),
Overlays::TrafficJams(_, _) => Some("traffic jams"),
Overlays::CumulativeThroughput(_, _) => Some("throughput"),
Overlays::BikeNetwork(_) => Some("bike network"),
Overlays::BusNetwork(_) => Some("bus network"),
Overlays::Elevation(_, _) => Some("elevation"),
Overlays::Edits(_) => Some("map edits"),
Overlays::TripsHistogram(_, _) => None,
Overlays::IntersectionDemand(_, _, _, _) => None,
Overlays::BusRoute(_, _, _) => None,
Overlays::BusDelaysOverTime(_, _, _) => None,
Overlays::BusPassengers(_, _, _) => None,
}
}
}
impl Overlays {
@ -971,3 +952,16 @@ impl Overlays {
Overlays::Edits(colorer.build(ctx, app))
}
}
fn maybe_unzoom(ctx: &EventCtx, app: &mut App) -> Transition {
if ctx.canvas.cam_zoom < MIN_ZOOM_FOR_DETAIL {
return Transition::Pop;
}
Transition::Replace(Warping::new(
ctx,
ctx.canvas.center_to_map_pt(),
Some(0.99 * MIN_ZOOM_FOR_DETAIL),
None,
&mut app.primary,
))
}