#Team Members: Kendall Lowrey Thanh Tam Nguyen #Project Name: Global Ocean Circulation and Temperature Surface ocean circulation and temperature from satellites are visualized on global and regional scales. D3 is used to look at circulation systems and distribution of sea surface temperature around the world. #Running Instructions:

http://cse512-15s.github.io/a3-klowrey-nttam15/ Warning: as the data sets are moderately large (~20mb) it may take a few moments to load. Global surface velocity and temperature are animated automatically in time for year 2012. Move the globe around to see how the current field looks like in the Atlantic (between America and Europe) and Pacific (between Asia and America) Oceans. Move the globe down and up to look at distribution of the surface velocity and temperature in different parts of the oceans, for example the subtropical part of the oceans in the Northern and Southern hemispheres. Water temperature is distributed as bands with warmer temperature close to the equator and in the tropical oceans and colder temperature in the subtropical oceans. Select a specific part of the oceans to look in detail and use zooming in and out to see the close up and wide shots of the surface currents and temperature. Click pause button to stop the animation at specific time period and then click resume button to resume the animation. #Describe the data domain and storyboard in the interaction techniques we use Ocean circulation is defined as horizontal movement of water in the ocean, which can be generated and influenced by winds, density gradient and the earth’s rotation. On the global scale, ocean circulation is a key to transport enormous amount of heat and regulates climate. We are interested in visualize how ocean circulation looks like on globe and regional scales. To have an overview of global circulation systems, Ocean Surface Current Analysis Real-time (OSCAR) data is selected with 1 x 1 degree latitude/longitude resolution (http://podaac.jpl.nasa.gov/datasetlist?ids=Measurement&values=Ocean%20Circulation&view=list). The OSCAR data is available with 5- day resolution from October 1992 to present, and data for year 2012 is used here. The horizontal near-surface velocity at 15m depth (u and v: zonal and meridional components) is estimated from sea surface height, surface vector wind and sea surface temperature, collected from different satellites and in situ observations by Earth Space Center (ESR) (http://www.esr.org/oscar_index.html). Moreover, to understand important characteristics of seawater around the globe, especially in the major current systems, 1/4° Optimum Interpolation Sea Surface Temperature (OISST) data is chosen (http://www.ncdc.noaa.gov/oisst/data-access). This daily satellite data is derived from the Advanced Very High Resolution Radiometer (AVHRR) and a sample is extracted in the same time periods as the OSCAR current data. D3 is chosen to visualize distribution of global ocean circulation and temperature. Velocity fields are plotted as vectors on the globe for a year 2012 with the strength of currents scaling with the vector length. Sea surface temperature can be shown like a rectangular array of cells with colors. Users can interact with the global map of surface currents and temperature with mouse control, zooming and tool tip. Mouse control lets users to move the globe map up and down and right and left. Zooming in and out is to enhance getability. Users also can select either surface currents or temperatures shown and see their animated changes all the year 2012. #The final interactive visualization application The dataset of surface currents and temperature is quite big and needs to be much processed. Matlab, ncview and panoply tools are used to explore the dataset. For the global surface currents, 5-day zonal and meridional velocities are available at 140 (latitude) x 360 (longitude) grid points for year 2012. Several filtering choices are tried to reduce the data file size and avoid delay in webpage display. Regular filtering for latitude and longitude seems not suitable and results in bands on the map. Therefore random filtering is finally applied to the current data -- only 10% of the total data is allowed. Daily sea surface temperature dataset is available with higher spatial resolution of ¼ degree at 720 (latitude) x 1440 (longitude) grid points, and 365 files are for year 2012. The temperature is collected and temporally and spatially filtered in order to be consistent with the current data with 360 data points at the equator that diminishes as it approaches the poles. These data are transformed from netcdf into json format for D3 use. Data files include 2012_10percent.json, temp_2p.json, world-110m.json for current, temperature, and the world geometry, respectively. In addition, libraries d3.v3.min.js, queue.v1.min.js and topojson.v0.min.js are required for geographic maps. Most of the storyboard is implemented in this application. Because of big amount of data and limited time, the visualization is just for only year 2012. Vectors are used to encode the current direction and magnitude and array of color rectangles is used to encode the temperature at coarse resolution. The change between the storyboard and the final implementation is that the current and temperature are rendered and animated together. The temperature is shown as the background field for the currents. This might help to understand the relationship among those fields. We use the dataset with coarser spatial resolution instead of finer one, because loading bigger data can slow down webpage display. Color bar is used for the temperature here instead of tooltip technique. Current data was originally supposed to encode specifically the exact flow, but this proved to either require very high resolution data, or was not easy for the human to actually measure (they would be looking at an instantaneous speed). Therefore, the vectors were exaggerated to provide the appropriate current flow feel. Interactivity is added to the application to enhance visualization of the global ocean circulation and temperature. Mouse control is used to move the map in the vertical and horizontal directions and mouse wheel is designed for zooming in and out activities. The surface current and temperature are animated at 5-day interval for year 2012. The animation can be stopped and resumed with controlling buttons. What users can see is the big picture of circulation gyres with stronger currents along the western boundary of the oceans, such as along the east coast of the US and Asia (Japan, Korea), about weaker currents along the eastern boundary of the oceans, such as the California Currents along the west coast of the US. The currents are zonal close to the equator. Users obviously recognize distribution of the global heat. Warmer surface water is in the tropical oceans and close to the equator. Waters in the eastern subtropic pool of the oceans seem warmer than in the western pool. This is a result of the circulation gyres in the oceans. For example, in the Atlantic ocean in the northern hemisphere, strong western currents going poleward on the bring the warm water from the equator to the subtropic oceans, otherwise weak eastern currents going equatorward transport the cold water from the north to the equator. Also users can see water temperature reduces significantly from the equator to the Poles.
#Development Process Work load is split for two group members, including tool choice, application design, data exploration, data processing and transformation, data encoding and testing. Tam handled the data processing due to her experience as an Ocean Scientist while Kendall managed the majority of the coding (despite being unfamiliar with Javascript / D3 -- hence the poor code). The data processing was done with matlab scripts to manage the specific file formats of this style of data.