Skip to content
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

Jump to bottom

added interactive map #60

Closed
wants to merge 4 commits into from
Closed

added interactive map #60

wants to merge 4 commits into from

Conversation

serenade2400
Copy link

Integrated Leaflet.js with React using react-leaflet for interactive maps.
Added Uttarakhand boundary visualization using GeoJSON data.
Fixed marker icons and displayed district markers with popups for cultural and historical info.
Enhanced UI with centered map and dynamic zoom for better region visibility.

@vercel Vercel
Copy link

vercel bot commented Oct 3, 2024 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
uttarakhand-culture ❌ Failed (Inspect) Oct 3, 2024 9:22pm

github-actions[bot]
github-actions bot reviewed Oct 3, 2024
View reviewed changes
Copy link

@github-actions github-actions bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎉 Thank you @serenade2400 for your contribution! Your pull request has been submitted successfully. A maintainer will review it as soon as possible. We appreciate your support in making this project better.

@serenade2400 serenade2400 mentioned this pull request Oct 3, 2024
Closed
1 task
@ajaynegi45
Copy link
Owner

Integrated Leaflet.js with React using react-leaflet for interactive maps. Added Uttarakhand boundary visualization using GeoJSON data. Fixed marker icons and displayed district markers with popups for cultural and historical info. Enhanced UI with centered map and dynamic zoom for better region visibility.

Resolve these error

Creating an optimized production build ...
Failed to compile.
./src/components/Mapcomponent.js
Module not found: Can't resolve 'react-leaflet'
https://nextjs.org/docs/messages/module-not-found
./src/components/Mapcomponent.js
Module not found: Can't resolve 'leaflet'
https://nextjs.org/docs/messages/module-not-found
./src/components/Mapcomponent.js
Module not found: Can't resolve 'leaflet/dist/leaflet.css'
https://nextjs.org/docs/messages/module-not-found
> Build failed because of webpack errors
Error: Command "npm run build" exited with 1

ajaynegi45
ajaynegi45 requested changes Oct 4, 2024
View reviewed changes
Copy link
Owner

@ajaynegi45 ajaynegi45 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more. 

Failed to compile.
./src/components/Mapcomponent.js
Module not found: Can't resolve 'leaflet/dist/leaflet.css'
https://nextjs.org/docs/messages/module-not-found
Build failed because of webpack errors
Error: Command "npm run build" exited with 1

src/components/Mapcomponent.js Outdated
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Make this file extension as .tsx

src/app/globals.css
}
/* Add this to your CSS file */
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Remove this css from here and add it to it's relevant component css files

src/app/page.tsx
@@ -12,6 +12,11 @@ import Notify_Banner from "/public/notify-early-banner.jpg"
import PahadiWomen from "/public/bhotiaWoman.webp"
import Screen from "@/components/Screen";
import Festivals from "@/components/Festivals";
import dynamic from 'next/dynamic'
const UttarakhandMap = dynamic(() => import('../components/Mapcomponent'), {
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Don't add this feature in home page add it another different page

package.json
@@ -11,7 +11,7 @@
"dependencies": {
"@vercel/speed-insights": "^1.0.12",
"leaflet": "^1.9.4",
"next": "14.2.5",
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Don't change the version

package.json
"eslint": "^8",
"eslint-config-next": "14.2.5",
"postcss": "^8.4.47",
"tailwindcss": "^3.4.13",
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Don't use tailwindcss

src/app/globals.css
@@ -122,3 +122,6 @@ a {
justify-content: center;
align-items: center;
}
@tailwind base;
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Remove tailwindcss

@ajaynegi45 ajaynegi45 mentioned this pull request Oct 4, 2024
Open
@ajaynegi45 ajaynegi45 closed this Oct 5, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@github-actions github-actions[bot] github-actions[bot] left review comments

@ajaynegi45 ajaynegi45 ajaynegi45 requested changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@serenade2400 @ajaynegi45