Skip to content

OTP2 Tilelayer MinZoom Support #825

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

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

OTP2 Tilelayer MinZoom Support #825

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -133,7 +133,7 @@
"update-internal-dependencies": "node scripts/update-internal-dependencies.js",
"test-storybook": "test-storybook --url http://localhost:5555",
"update-snapshots": "pnpm build-storybook; npx concurrently -k -s first -n \"SB,TEST\" \"npx http-server storybook-static --port 5555 --silent\" \"npx wait-on tcp:5555 && pnpm test-storybook --url http://localhost:5555 -u\"",
"pack-all": "lerna exec --no-private -- 'pnpm pack && echo \"Package tarball: $(pwd)/$(ls *.tgz)\"'"
"pack-all": "pnpm prepublish && lerna exec --no-private -- 'pnpm pack && echo \"Package tarball: $(pwd)/$(ls *.tgz)\"'"
},
"eslintConfig": {
"env": {
Expand Down
20 changes: 13 additions & 7 deletions packages/otp2-tile-overlay/src/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ const OTP2TileLayerWithPopup = ({
getEntityPrefix,
id,
network,
minZoom = 14,
onMapClick,
setLocation,
setViewedStop,
Expand All @@ -45,6 +46,10 @@ const OTP2TileLayerWithPopup = ({
* that network
*/
network?: string
/**
* The minimum zoom to show the layer at. Defaults to 14
*/
minZoom?: number
/**
* An optional method to override the map click handler. If a method is passed, NO POPUPS
* WILL APPEAR ON CLICK. The implementer will be responsible for handling all click events
Expand Down Expand Up @@ -170,14 +175,14 @@ const OTP2TileLayerWithPopup = ({
}}
source-layer={type}
source={SOURCE_ID}
minzoom={stopsWhitelist ? 2 : 14}
minzoom={stopsWhitelist ? 2 : minZoom}
type="fill"
/>}
{isArea && <Layer
filter={filter}
id={`${id}-outline`}
layout={{ "line-join": "round", "line-cap": "round" }}
minzoom={stopsWhitelist ? 2 : 14}
minzoom={stopsWhitelist ? 2 : minZoom}
paint={{
"line-color": ROUTE_COLOR_EXPRESSION,
"line-opacity": 0.8,
Expand All @@ -193,7 +198,7 @@ const OTP2TileLayerWithPopup = ({
key={`${id}-stops`}
paint={generateLayerPaint(color).stops}
source={SOURCE_ID}
minzoom={stopsWhitelist ? 2 : 14}
minzoom={stopsWhitelist ? 2 : minZoom}
source-layer="stops"
type="circle"
/>}
Expand All @@ -203,7 +208,7 @@ const OTP2TileLayerWithPopup = ({
key={`${id}-stations`}
paint={generateLayerPaint(color).stops}
source={SOURCE_ID}
minzoom={stopsWhitelist ? 2 : 14}
minzoom={stopsWhitelist ? 2 : minZoom}
source-layer="stations"
type="circle"
/>}
Expand All @@ -213,7 +218,7 @@ const OTP2TileLayerWithPopup = ({
key={id}
paint={generateLayerPaint(color)[type]}
source={SOURCE_ID}
minzoom={stopsWhitelist ? 2 : 14}
minzoom={stopsWhitelist ? 2 : minZoom}
source-layer={type}
type="circle"
/>}
Expand Down Expand Up @@ -254,7 +259,7 @@ const OTP2TileLayerWithPopup = ({
* @returns Array of <Source> and <OTP2TileLayerWithPopup> components
*/
const generateOTP2TileLayers = (
layers: { color?: string; name?: string; network?: string; type: string, initiallyVisible?: boolean, overrideType?: string }[],
layers: { color?: string; name?: string; network?: string; type: string, initiallyVisible?: boolean, minZoom?: number, overrideType?: string }[],
endpoint: string,
setLocation?: (location: MapLocationActionArg) => void,
setViewedStop?: (stop: Stop) => void,
Expand All @@ -278,7 +283,7 @@ const generateOTP2TileLayers = (
url={`${endpoint}/${layers.map((l) => l.overrideType || l.type).join(",")}/tilejson.json`}
/>,
...layers.map((layer) => {
const { color, name, network, type, initiallyVisible } = layer
const { color, name, network, type, minZoom, initiallyVisible } = layer

const id = `${type}${network ? `-${network}` : ""}`
return (
Expand All @@ -290,6 +295,7 @@ const generateOTP2TileLayers = (
key={id}
name={name || id}
network={network}
minZoom={minZoom}
setLocation={setLocation}
setViewedStop={setViewedStop}
stopsWhitelist={stopsWhitelist}
Expand Down