Skip to content

1022922: Updated ReadMe file of the project. #4

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
mohammednowfel4989 wants to merge 1 commit into
base: main
Choose a base branch
from
Open

1022922: Updated ReadMe file of the project. #4

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
43 changes: 34 additions & 9 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,18 +1,43 @@
# Zooming and Panning in the Blazor Maps Component

This sample explains about how to zoom and pan a Syncfusion Blazor Maps in a Blazor WebAssembly app. This project also includes a code snippet to customize the zooming modes, zooming toolbar, and other toolbar options.
This project demonstrates how to implement and customize zooming and panning functionality in the Syncfusion Blazor Maps component using a Blazor WebAssembly application. The sample focuses on user interaction features that allow map navigation through zoom levels, pan gestures, and toolbar controls. It serves as a practical reference for developers who want to understand map interaction behavior and customization options available in Blazor Maps.

**Example**: https://blazor.syncfusion.com/demos/maps/zooming?theme=bootstrap5
## Project Overview

The sample application highlights how zooming and panning enhance map usability in web applications. It includes configurations for zoom modes, zoom factor limits, and toolbar visibility. The project is designed to help developers explore common map interaction patterns and understand how those options can be enabled or customized within a Blazor WebAssembly environment using Syncfusion components.

## Features

**Documentation**: https://blazor.syncfusion.com/documentation/maps/user-interactions#zooming
- Enable zooming and panning interactions in Blazor Maps
- Configure different zooming modes supported by the component
- Display and customize the zooming toolbar
- Demonstrate smooth map navigation through user input

## Prerequisites

* Visual Studio 2022
Before running this project, ensure the following requirements are met:

- Visual Studio 2022 installed
- .NET SDK compatible with Blazor WebAssembly
- Basic knowledge of Blazor and component-based UI development

## How to Run the Project

1. Clone or check out the project to a local directory on your system.
2. Open the solution file using Visual Studio 2022.
3. Restore the required NuGet packages by rebuilding the solution.
4. Run the project to launch the Blazor WebAssembly app in your browser.

## Usage

Once the application is running, interact with the map using mouse or touch gestures to zoom in, zoom out, and pan across different regions. Use the zoom toolbar to control zoom levels and observe how the map responds to user interactions in real time.

## Additional Resources

An interactive demo showcasing the zooming behavior can be viewed here:
**Example**: https://blazor.syncfusion.com/demos/maps/zooming?theme=bootstrap5

## How to run the project
Detailed official documentation related to map zooming and user interactions is available here:
**Documentation**: https://blazor.syncfusion.com/documentation/maps/user-interactions#zooming

* Checkout this project to a location in your disk.
* Open the solution file using the Visual Studio 2022.
* Restore the NuGet packages by rebuilding the solution.
* Run the project.
This sample is intended for learning and reference purposes and can be extended further to fit real-world mapping scenarios.
Loading