Atlas of European & Mid-East Conflict - 1000 A.D. to 1700 A.D.

This Atlas Of European & Mid-East Conflicts is an interactive map and database of major Conflicts occurring in Europe, the Middle East and western Asia, between the years 1000 A.D. and 1700 A.D. The map and country overlay boundaries are set to the following geographic boundaries:

This geographic quadrangle is represented by the underlying base map as shown below. Map tiles are generated using a simple Stamen water-color style through a MapBox server (refer to the Technical Details section at the end of this Help file). The underlying map looks as follows:

Underlying (un-zoomed) Base Map

A Conflict is comprised of one or more associated Wars. Each War consists of series of Events, ranging over a period of time, leading to a change in political boundaries, leadership, etc.  Each Event is an individual battle, siege, or skirmish that played into the Conflict and had an impact on the outcome of the Conflict. Each Event is represented on the map by its location, with various levels of summary information provided for further reference.

In addition to an underlying base map, the Atlas contains 388 individual colored overlay maps that depict the evolution of geo-political borders throughout the 700-year time span of the Atlas (refer to the Technical Details section for how the overlay maps are created, rendered and displayed). When a Conflict or an Event is displayed, the appropriate overlay map is updated to reflect the geographical year of occurrence of the Event, or the beginning year of the selected Conflict. The Year display at the bottom of the map reflects this Conflict/Event year. You can advance the Year one at a time through the left/right arrows of the Date Control at the bottom left corner of the map area.

Standard map controls allow you to zoom through four levels from an initial scale of 1 inch = approximately 200 miles or 500 km (minimum zoom) to a maximum of approximately 1 inch = 20 miles or 50 km (maximum zoom). The map can be panned at higher zoom levels but attempting to pan outside of the geographical area represented in the initial display causes the map to re-center to within the limits listed above.

Initial Display - Showing Historical Countries

Battlefield Markers
Example: Showing Results for the Crusades (detail focused on the Levant)

Making Selections

The Menu screen allows you to choose Events in any of three ways: by date range, by Conflict, or by key word or phrase. When Event parameters are entered, the Go button turns green. Click to retrieve all Events associated with the Dates, Conflict, or key words.

Initial Menu Screen

To Select Events By Year Range

Click the grey By Date Range bar on the menu screen.   The bar turns blue and the Start Year and End Year fields are activated. Enter a Start Year and optional End Year, then click the Go button. All Events between the two years inclusive are displayed.  If no End Year is entered, the default is the Start Year, and a single year's Events will be displayed.

Menu Screen - Select Events by Date Range

You can enter dates manually by placing the cursor in the appropriate box. Alternatively, click the green Calendar icon to bring up the Year Selector. Navigate to the desired year, and click to select. The year is entered into the Start Year or End Year field.


Selecting Events Using the Date Selector

To Select Events By Conflict

Click the grey By Conflict bar on the menu screen.   The bar turns blue and the list of Conflicts is displayedSelect a Conflict from the drop-down selection list.   

Menu Screen - Select Events by Conflict

To Search For Events Containing A Word Or Phrase

Click the grey By Words or Phrases bar on the menu screen.   The bar turns blue and the and the Search field is activated. Enter one or more key words or a phrase (for example, the name of a city or location), then click the Go button.  All events with the specified word or phrase in the Event Title or the Event Description are displayed. NOTE: to search for a phrase, enclose it in double quotes - for example, "First Crusade". Otherwise, all Events containing any of the search words are displayed.

Menu Screen - Select Events by Words or Phrases

Selection Results

Conflict Summary

A summary of the currently selected Conflict is displayed in the top left panel of the display in a scrollable window.

Conflict Summary Panel

Event List

All Events matching the selected criteria are returned in an Event List in the bottom left panel of the display. Event details include the Event Title, associated Conflict, date(s) when the Event occurred, and the geographic location of the Event.  Click the blue header ribbon containing the Event Title.  The Event background color changes to a light blue, and the associated icon marker on the map changes color from red to blue.  An Event Summary displays in a popup window on the map (see Event Display, below).

Event List Panel

Event Display

All Events are positioned on the map using markers.  A shield marker  indicates the position of a land battle, and a ship marker  indicates the position of a sea battle.

Click on a marker, and the following actions occur: the associated Event in the Event List is highlighted.  A small window opens at the marker location with a summary of the Event. Click the small window to close it and display the marker in blue. (Note that this is the same result you get by clicking the Event Title in the Event List, as described above).

Sample Event Detail

Locations Display

The locations of all Events (battles, sieges, etc.), are ALWAYS displayed on the map, regardless of any selection choices. Each location is marked with a black marker whose size indicates the relative importance of the location on a scale of 1 (least) to 4 (most) significant. Land locations have names of the site where the battle occurred, Sea locations are marked with an X.  Clicking on a location marker displays a popup listing ALL Events that have occurred at that location. Each listed Event is a link that directs you to the relevant Wikipedia page when selected.

Example Location Details: Show All Events at a land Location (left) and sea Location (right)

Map Overlay Control

The Map Overlay Intensity control    in the upper right corner of the map allows you to emphasize or de-emphasize the intensity of the overlay maps; a zero setting displays the base map only whereas a setting of 100% puts full focus on the historical countries and boundaries.

Conflict and Event Reference Materials

The icon indicates the availability of an appropriate Wikipedia page for further reference on any Conflict or Event. Click the icon to display the Wikipedia content in separate window, as in the following example.

Wikipedia Reference Page for Selected Event

Technical Details

This section provides some detail on the implementation of the Atlas.

I am greatly indebted to the following technologies, all of which are free for use via standard GNU licensing or similar access rights:

Representative Source Code

Battlefield Locations and Labels

Locations are named after Events, which are generally the names of where the event occurred. Location data (name, geo-coordinates, importance, etc.) is maintained in a mySQL file on the local server. Locations are created when the Leaflet map is initialized at startup. Locations are rendered on four separate custom Leaflet panes, based on the relative importance of the event on a scale of 4 (most important) to 1 (least important). The four panes are sandwiched logically between the base tile layer and the SVG overlay layer. Each location on a pane is rendered as a Leaflet circleMarker instance and an associated (bound) Label instance. Each circleMarker/Label has an associated click event that displays the contents of the location popup window. The level 4 locations are displayed on zoom levels 5 through 8, level 3 locations are displayed on zoom levels 6 through 8, level 2 locations are displayed on zoom levels 7 and 8, and level 1 locations are only displayed on zoom level 8. Further zooming is inhibited, primarily since uncertainties in historical battle locations are such that more detailed zooming would imply false accuracy.

Javascript file to create and manage the four location overlays

Year Selector Field

The code to display a range of years from 1000 A.D. to 1700 A.D. is built entirely in Javascript and CSS, with only a reference <div> element to contain the display.

Javascript file to create and manage the Start Year and End Year Cascading Menus

CSS file to create and manage the Start Year and End Year Cascading Menus

Scalable Vector Graphics Overlays

The nearly 400 SVG overlay diagrams used to represent yearly changes in country boundaries over the course of 700 years were obtained through screen captures of the changes implemented in the Geacron Project as described above. Each screen capture was rendered in Inkscape and the country names were manually added.  Each diagram was properly positioned on the initial map base so that all year-to-year boundary changes appear seamless. The SVG overlay is generated on the Leaflet overlay pane. The code to create the initial overlay display code, as well as transform the SVG x and y coordinates when the map is panned and zoomed, is shown here. The key method scaleRegion() performs the zoom transform calculations.

Javascript file to perform initial display and pan/zoom 

Status and Caveats

This is a work in progress; as of the latest update, the Events database contains over 1400 entries, grouped into approximately 20 Conflicts.  Future plans are to add individual Wars and Countries to the selection capability which requires some enhancements to the current database structure. I would also like to implement a 3-D map display (e.g., using Google World as a base map), and build an Animator capability that automatically sequences through the map geo-political borders over a specified time interval.

First of all I am not an historian, by education or profession. Reading history is something I enjoy doing, but as with many subjects that don't involve direct experience, I find it difficult at times to grasp the large scale historical flow of events, especially over extended periods of time and across fluid geo-political boundaries.  So developing this site is an exercise in gaining a better sense of that flow.  Of course, any major conflict evolves over time as the result of complex political, economic, and religious factors that cannot possibly be represented with simplistic static displays. As with any high-level summary of complex geo-political, regional, and local events, I had to make some concessions for the sake of simplicity. I use the notion of a Conflict as a convenient method of grouping historical Events into manageable collections for storage and retrieval. This sometimes results in placing Events into Conflicts that may seem somewhat arbitrary.  And the time-frame in which Events occur has to be bounded rather narrowly; in reality, the lead-up to a battle or siege takes time and almost always involves movement of forces that cannot be accurately represented in the format I use here.  For details on the events, I tried to maintain a single point of reference, hence the use of Wikipedia; the usual caveats apply to the information contained there as well.

I welcome comments, (constructive) criticism, suggestions, and improvements; please refer to the Contact information in the Footer display at the bottom of the Web page.