Saudi Cities Mapping

Description and Requirements

Develop windows application that uses combo box to display the names of several Saudi cities. Set the names of the cities in a combobox (to be loaded from a text file) and distance from Al Khubar to each of the above mentioned cities (to be loaded from a text file to an array). When the user selects a city from the combobox, its distance from Al Khobar is displayed as well as the map of that city. To give you a startup, I will guide you through the important steps of development. see image.

Create and name the controls as shown in the figure above.

Use: 4 labels, 1 comboBox, 1 pictureBox and 1 webBrowser

Where:

• cboCities is the name of the a Combo Box control
• lblDistance is a label control with font set bigger and bold used for output.
• webBrowser1 is a webBrowser control. Make it invisible by setting the visible property to false.
• picMap is a pictureBox control. Keep it visible by leaving the visible property at true and load it with appropriate picture on the design mode.
• The rest are Label controls.

1-Declare a global array called distance of type integer to hold the distances. Set its size to a value higher than the possible number of cities. I used 20.

2-cboCities combo box

Load the text from a file. Split the text on tab. The file contents looks like the following:

Riyadh 500
Ahsaa 170
Mecca 1370
Medina 1280
Dammam 50
Taif 1300
Tabook 1000

Note: the space between the city name and distance must be one tab only.

Load the cboCities with the city names and the array with the distances. See the following code:

TextReader tr = File.OpenText(@"d:... \Cities.txt");
string strLine = string.Empty; //or use = "";
string[] arrColumns = null;
while ((strLine = tr.ReadLine()) != null)
{
arrColumns = strLine.Split('t');
cboCities.Items.Add(arrColumns[0]);
distance[count++] = arrColumns[1];
}
tr.Close();

The above code will be loaded in the form load method.

Note: if you put the text file in yourProjectfolderbindebug you dont need to mention the path. In other words, the first statement will be:

TextReader tr = File.OpenText("Cities.txt");

3-Program the cboCities method to display the distance in the lblDistance control and the map of the selected city.

Use a code similar to the following:

lblDistance.Text = distance[cboCities.SelectedIndex];
string htmlText = "< iframe width=\"425\" height=\"350\" src=\"";
if (cboCities.SelectedItem.ToString() == "Mecca")
htmlText += "http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Mecca,+Makkah+Province,+Saudi+Arabia&aq=1&oq=Mecca&sll=38.065392,-95.712891&sspn=46.486464,93.076172&ie=UTF8&hq=&hnear=Mecca,+Makkah+Province+Saudi+Arabia&t=m&z=11&ll=21.416667,39.816667&output=embed";
htmlText += "\">";

or from Share -> Embed map

htmlText = "< iframe src=\"https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d927764.3554916603!
2d46.26204560660279!3d24.724150332039134!2m3!1f0!2f0!3f0!3m2!1i1024
!2i768!4f13.1!3m3!1m2!1s0x3e2f03890d489399%3A0xba974d1c98e79fd5
!2sRiyadh!5e0!3m2!1sen!2ssa!4v1488405290695\"
width=\"600\" height=\"450\" frameborder="0" style=\"border:0\" allowfullscreen>"

(put \ before each " or try to change it to ')

picMap.Visible = false;
webBrowser1.Visible = true;
webBrowser1.DocumentText= htmlText;

If you want to create more maps use the following site: http://maps.google.com/

Set your cities. Click on the embed or the link at the top-right. Copy the link and add it to the application.