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.

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

I have a problem with running debugging this azuremapscodesample app it won't run I get this error shown in screenshot #133

Closed
luke827 opened this issue Jun 19, 2024 · 18 comments

Comments

@luke827
Copy link

luke827 commented Jun 19, 2024

I have a problem with running debugging this azuremapscodesample app it won't run I get this error shown in screenshot
Screenshot (68)
Screenshot (69)

@luke827 luke827 changed the title I have a problem with running debugging this azuremapscodesample it won't run I get this error shown in screenshot I have a problem with running debugging this azuremapscodesample app it won't run I get this error shown in screenshot Jun 19, 2024
@cschotte
Copy link
Collaborator

It looks like you're trying to run the deployment code for building the entire Azure Maps website, but that's probably not what you need. If you're interested in one or more specific samples, you can simply take the HTML/JavaScript code and add it to a basic website. In Visual Studio, you can do this by adding an existing website to your solution. All Azure Maps samples are purely HTML and JavaScript, with no C# code required (except for the deployment system of the samples site itself).

@luke827
Copy link
Author

luke827 commented Jun 19, 2024 via email

@rbrundritt
Copy link
Contributor

rbrundritt commented Jun 19, 2024

There is no single visual studio project type for Azure Maps web SDK or Azure Maps in general. Azure Maps is a component you can add to your app. If you are developing for web, create a web app in Visual Studio's. There are a done of different project types to choose from depending on what programming language and frameworks you want to use. Note that Azure Maps web SDK can be used in the most basic of HTML apps (advanced ones too) which doesn't require anything special to write (you can write HTML files in notepad if you wanted).

That said, if you plan to deploy your app to Azure and are using HTML and JavaScript, I recommend either create an Azure Web App (useful if you need to do some backend processing on the server, like retrieving an auth token securely) or an Azure Static Website (good if you don't need any backend processing). I usually go the Web App route (project template: "ASP.NET Web Application"), but mainly out of habit and I tend to do more advanced things, like hosting a sqlite file of map tiles on the server side that I use to serve custom data to the map. A static website is often sufficient for general web apps. Here are some resources:

Static Web Apps:

Azure Web Apps:

@luke827
Copy link
Author

luke827 commented Jun 19, 2024 via email

@luke827
Copy link
Author

luke827 commented Jun 19, 2024 via email

@luke827
Copy link
Author

luke827 commented Jun 19, 2024 via email

@cschotte
Copy link
Collaborator

WinUI 3 and Windows App SDK now support native Azure Maps control
With the latest updates to Windows App SDK 1.5+ we brought to WinUI 3 one of the most requested features, the Maps control, powered by WebView 2 and Azure Maps. You can learn more about the controls and features in WinUI 3 in the interactive WinUI 3 Gallery App https://apps.microsoft.com/detail/9p3jfpwwdzrc

@luke827
Copy link
Author

luke827 commented Jun 19, 2024

How do I make a uwp app like google earth using Azure maps web SDK via a WebView in mainpage.xml MainPage.xaml.cs with search bar on visual studio 2022

@cschotte
Copy link
Collaborator

To create a UWP app similar to Google Earth using the Azure Maps Web SDK within a WebView in MainPage.xaml and MainPage.xaml.cs, you can embed HTML and JavaScript code that utilizes the Azure Maps Web Control. You can start by crafting the map as a standalone web application. Once you have the map functioning on a webpage, you can then transfer that HTML and JavaScript code into the WebView component in your UWP app. For guidance on implementing the map control, refer to the Azure Maps samples. This approach allows you to focus on building the map functionality first and then integrating it into your UWP application.

@rbrundritt
Copy link
Contributor

I've put together a code sample here: https://github.com/rbrundritt/SimpleUwpAzureMaps

The UWP WebView control hasn't been updated in ages and is very buggy, and slow. I recommend using WebView2 (which is what I'm using in the sample). With WebView2 you can also access the browser developer tools which will save to ton of headaches when debugging (just press F12 when the WebView has focus).

I recommend reading through the following guide: https://learn.microsoft.com/en-us/microsoft-edge/webview2/get-started/winui2

There are some hurdles with local files that you need to align with: https://learn.microsoft.com/en-us/microsoft-edge/webview2/concepts/working-with-local-content?tabs=dotnetcsharp

For the sample I used the "WebResourceRequested" approach as it provides the most flexibility. It's a bit more work but can be very powerful for advanced scenarios. This approach basically creates a simple proxy that intercepts requests for local content, then loads the local file depending on where it is stored.

The main limitation with using a WebView currently is that you can't overlay XAML controls above it. However, there are plans for WebView2 to support this around the end of summer. MicrosoftEdge/WebView2Feedback#286 (comment)

@luke827
Copy link
Author

luke827 commented Jun 20, 2024

I need it to have all the functions like in screenshots that's circled
https://samples.azuremaps.com/?sample=
Screenshot (97)
Screenshot (98)
Screenshot (99)
Screenshot (100)
Screenshot (101)

@luke827
Copy link
Author

luke827 commented Jun 20, 2024

And with Search bar

@luke827
Copy link
Author

luke827 commented Jun 20, 2024

Screenshot (102)
Screenshot (103)

@rbrundritt
Copy link
Contributor

rbrundritt commented Jun 20, 2024

Great. Every one of those samples has a "Source Code" button that you can press that will show you all the code for that individual sample. You mainly just need to copy and paste parts of the code into the MapApp.html file of the UWP sample I provided. It would likely take 30mins to an hour at most.

Note that my involvement in the developer community, helping people on forums and writing code samples, is completely volunteer and something I do for fun. I love helping getting developers on the right track and solving hard problems. The hard parts of what you need are done and documented, and what's left is pretty easy and straight forward. If you don't want to do the development yourself, consider hiring someone. Microsoft does have a consulting services arm, but they are pretty expensive (I actually do contract work for Microsoft as a Principal Architect for some customers at a rate around $500/hr). Microsoft has lots of partners who provide consulting services (usually cheaper than my rate). If you are on a tight budget, I'm sure there are many who could do this on https://www.upwork.com/

@luke827
Copy link
Author

luke827 commented Jun 21, 2024

How do I make a web app like google earth using the Azure Maps Web SDK via a WebView on visual studio 2022

@luke827
Copy link
Author

luke827 commented Jun 21, 2024

Can you set up the code for me for the uwp with the functions that I need as shown above to rbrundritt and by the github email link you sent me like before with the sample?
Screenshot (104)
Screenshot (105)

@rbrundritt
Copy link
Contributor

Azure Maps doesn't provide 3D maps with buildings like Google Earth, and I'm not aware of any plans to add it. In general those types are maps are very expense to produce and we have seen little usage of them by enterprise customers, so hard to justify investing in those going forward.

I won't be adding all those code samples to the UWP sample I provided. It's literally copy and paste for 95% of it and shouldn't take you more than an hour.

@luke827
Copy link
Author

luke827 commented Jun 21, 2024

Can you show me the steps I need to do

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants