F9 Group Marketing and Technology Blog

Over the past two weeks I’ve showed how to build a store locator application using ASP.NET and the free Google Maps API and Google’s geocoding service. Part 1 looked at creating the database to record the store locations. This database contains a table named Stores with columns capturing each store’s address and latitude and longitude coordinates. Part 1 also showed how to use Google’s geocoding service to translate a user-entered address into latitude and longitude coordinates, which could then be used to retrieve and display those stores within (roughly) a 15 mile area. At the end of Part 1, the results page listed the nearby stores in a grid. In Part 2 we used the Google Maps API to add an interactive map to the search results page, with each nearby store displayed on the map as a marker. The map added in Part 2 certainly improves the search results page, but the way the nearby stores are displayed on the map leaves a bit to be desired. For starters, each nearby store is displayed on the map using the same marker icon, namely a red pushpin. This makes it difficult to match up the nearby stores listed in the grid with those displayed on the map. Hovering the mouse over a marker on the map displays the store number in a tooltip, but ideally a user could click a marker to see more detailed information about the store, such as its address, phone number, a photo of the storefront, and so forth. This third and final installment shows how to enhance the map created in Part 2

Last week’s article, Building a Store Locator ASP.NET Application Using Google Maps API (Part 1) , was the first in a multi-part article series exploring how to add store locator-type functionality to your ASP.NET website using the free Google Maps API . Part 1 started with an examination of the database used to power the store locator, which contains a single table named Stores with columns capturing the store number, its address and its latitude and longitude coordinates. Next, we looked at using Google Maps API’s geocoding service to translate a user-entered address, such as San Diego, CA or 92101 into its latitude and longitude coordinates. Knowing the coordinates of the address entered by the user, we then looked at writing a SQL query to return those stores within (roughly) 15 miles of the user-entered address.

Over the past couple of months I’ve been working on a couple of projects that have used the free Google Maps API to add interactive maps and geocoding capabilities to ASP.NET websites. In a nutshell, the Google Maps API allow you to display maps on your website, to add markers onto the map, and to compute the latitude and longitude of an address, among many other tasks. With some Google Maps API experience under my belt, I decided it would be fun to implement a store locator feature and share it here on 4Guys. A store locator lets a visitor enter an address or postal code and then shows the nearby stores. Typically, store locators display the nearby stores on both a map and in a grid, along with the distance between the entered address and each store within the area. To see a store locator in action, check out the Wells Fargo store locator . This article is the first in a multi-part series that walks through how to add a store locator feature to your ASP.NET application. In this inaugural article, we’ll build the database table to hold the store information. Next, we’ll explore how to use the Google Maps API’s geocoding feature to allow for flexible address entry and how to translate an address into latitude and longitude pairs. Armed with the latitude and longitude coordinates, we’ll see how to retrieve nearby locations as well as how to compute the distance between the address entered by the visitor and the each nearby store. (A future installment will examine how to display a map showing the nearby stores.) Read on to learn more! Read More >

Filtering Database Data with Parameters , an earlier installment in this article series, showed how to filter the data returned by ASP.NET’s data source controls. In a nutshell, the data source controls can include parameterized queries whose parameter values are defined via parameter controls. For example, the SqlDataSource can include a parameterized SelectCommand , such as: SELECT * FROM Books WHERE Price > @Price . Here, @Price is a parameter ; the value for a parameter can be defined declaratively using a parameter control . ASP.NET offers a variety of parameter controls, including ones that use hard-coded values, ones that retrieve values from the querystring, and ones that retrieve values from session, and others. Perhaps the most useful parameter control is the ControlParameter, which retrieves its value from a Web control on the page. Using the ControlParameter we can filter the data returned by the data source control based on the end user’s input. While the ControlParameter works well with most types of Web controls, it does not work as expected with the CheckBoxList control. The ControlParameter is designed to retrieve a single property value from the specified Web control, but the CheckBoxList control does not have a property that returns all of the values of its selected items in a form that the CheckBoxList control can use. Moreover, if you are using the selected CheckBoxList items to query a database you’ll quickly find that SQL does not offer out of the box functionality for filtering results based on a user-supplied list of filter criteria. The good news is that with a little bit of effort it is possible to filter data based on the end user’s selections in a CheckBoxList control.

The Microsoft Chart controls demos we have examined so far all use the Chart Web control to position the chart image on the web page and to configure a number of its stylistic settings. For example, while the Plotting Chart Data article showed several demos illustrating the different ways to specify the points to plot on the chart surface, all of these demos used a Chart Web control to indicate where on the page the chart should appear, along with its dimensions, its series, its chart areas, its colors, and so on. While the Chart Web control makes it easy to get started with the chart, it is not necessary. From the ASP.NET page’s code-behind class you can: programmatically create a Chart object; specify its width, height, colors, and other display-related properties; plot the charts data points through any of the mechanisms discussed in Plotting Chart Data ; and generate an image for the chart in a number of different image formats, saving the image data to a file or to a stream. Being able to programmatically configure the chart and generate the chart image is useful if you want to modify the chart image in some way before displaying it. Perhaps you want to add a watermark, or embed it inside a PDF file . Maybe you don’t want to display it at all, but instead want to send it as an attachment in an email, or save the image to the web server’s file system or to the database. Whatever the scenario, the good news is that the Microsoft Chart controls make it easy to programmatically create, customize, and generate the chart image. This article looks at how to programmatically create a chart. Specifically, we’ll see how to dynamically add a watermark to the generated chart image, as well as how to email the chart to a recipient. The demos in this installment do not use the Chart Web control at all; instead, the charts in these demos are created and rendered directly from the ASP.NET pages’ code-behind classes. Read on to learn more! Read More >

The configuration information for an ASP.NET application is stored in one or more XML-based configuration files named Web.config . The default configuration settings for all web applications on the web server are spelled out in the Web.config file in the $WINDOWS$Microsoft.NETFramework version CONFIG folder. These default settings can be added to over overridden for a specific web application by the Web.config file in that application’s root directory. Moreover, these configuration settings can be customized for a web application on a folder-by-folder basis by adding Web.config files to the application’s subfolders

In August 2008 Microsoft released the latest version of the database server software, SQL Server 2008 .

Most data-driven web applications have a fixed data model and user interface. What I mean by “fixed” it that the data it needs to be captured is known in advance. Consequently, the database’s tables are created before a single line of code is written and the application’s user interfaces are dictated by this pre-determined data model. While most applications work with a fixed data model there are scenarios where the parts of the data model need to be defined by the end user. Such applications are more difficult to create because both the data model and user interface need to be flexible enough to allow the user to specify the information to be captured