Index: /ether_megapoli/trunk/service/implementation/com/ether/EtherPlotContentServiceImpl.java
===================================================================
--- /ether_megapoli/trunk/service/implementation/com/ether/EtherPlotContentServiceImpl.java	(revision 196)
+++ /ether_megapoli/trunk/service/implementation/com/ether/EtherPlotContentServiceImpl.java	(revision 197)
@@ -29,5 +29,4 @@
 import gov.noaa.pmel.util.Point2D;
 import gov.noaa.pmel.util.Range2D;
-import gov.noaa.pmel.util.Rectangle2D;
 import gov.noaa.pmel.util.SoTPoint;
 import gov.noaa.pmel.util.SoTRange;
@@ -185,5 +184,4 @@
 
         // Create the grid
-//        final SGTMetaData zMeta = new SGTMetaData( "ts", "m s-1" );
         final SGTMetaData xMeta = new SGTMetaData( bundle.getString( "plot.longitude" ), bundle.getString( "plot.degres" ) );
         final SGTMetaData yMeta = new SGTMetaData( bundle.getString( "plot.latitude" ), bundle.getString( "plot.degres" ) );
@@ -192,5 +190,4 @@
         simpleGrid.setXMetaData( xMeta );
         simpleGrid.setYMetaData( yMeta );
-//        simpleGrid.setZMetaData( zMeta );
         simpleGrid.setRealFullGrid( false );
 
@@ -212,6 +209,6 @@
         final Integer parameterId = pIdPId.getSecondValue();
 
-//        final Parametre parametre = _etherService.getParameterById( parameterId );
-        final Parametre parametre = BouchonHelper.getParameterById( parameterId );
+        final Parametre parametre = _etherService.getParameterById( parameterId );
+//        final Parametre parametre = BouchonHelper.getParameterById( parameterId );
         if( null == parametre )
             throw new ServiceException( ServiceException.ServiceCode.PARAMETER_IS_NULL, new Throwable( ServiceException.ServiceCode.PARAMETER_IS_NULL.toString() ) );
Index: /ether_megapoli/trunk/web/resources/css/visu_parameter_by_pf.css
===================================================================
--- /ether_megapoli/trunk/web/resources/css/visu_parameter_by_pf.css	(revision 196)
+++ /ether_megapoli/trunk/web/resources/css/visu_parameter_by_pf.css	(revision 197)
@@ -96,4 +96,18 @@
 }
 
+.imageExamples {
+    margin : 10px;
+}
+
+.textExamples {
+    color: #04155D;
+    margin-bottom: 10px;
+}
+
+.textExamplesTD {
+    color: #04155D;
+    text-align: center;
+}
+
 /** ************************************ **/
 /** ************ CALENDAR ************** **/
Index: /ether_megapoli/trunk/web/src/ApplicationResources.properties
===================================================================
--- /ether_megapoli/trunk/web/src/ApplicationResources.properties	(revision 196)
+++ /ether_megapoli/trunk/web/src/ApplicationResources.properties	(revision 197)
@@ -426,4 +426,14 @@
 ####################### ETHER ##################################
 ################################################################
+data.visualization.general.text=Dans cette zone, vous pouvez visualiser en ligne les donn\u00E9es disponibles. Plusieurs types de visualisations vous sont propos\u00E9s :<ul><li>un param\u00E8tre pour un site</li><li>un param\u00E8tre pour plusieurs sites</li><li>diff\u00E9rents param\u00E8tre pour un site</li><li>des visualisations en 2D</li></ul>
+data.visualization.general.text2=Vous pouvez visualiser au maximum deux types de param\u00E8tres diff\u00E9rents sur autant de plateformes disponibles.
+data.visualization.general.example=Exemples de s\u00E9ries temporelles :
+data.visualization.general.example.param.site=Ozone au LHVP
+data.visualization.general.example.param.sites=Ozone au LHVP et au SIRTA
+data.visualization.general.example.params.site=Ozone et Temp\u00E9rature au SIRTA
+data.visualization.general.example.params.sites=Ozone (LHVP et SIRTA) <BR/> Temp\u00E9rature (SIRTA)
+data.visualization.general.example.2D=Exemple de visualisation 2D :
+
+####################### VISUALIZATION #######################
 inWork=Page en cours de construction..
 all.visualization=Visualisation
Index: /ether_megapoli/trunk/web/src/ApplicationResources_en.properties
===================================================================
--- /ether_megapoli/trunk/web/src/ApplicationResources_en.properties	(revision 196)
+++ /ether_megapoli/trunk/web/src/ApplicationResources_en.properties	(revision 197)
@@ -425,4 +425,14 @@
 ####################### ETHER ##################################
 ################################################################
+data.visualization.general.text=In this area you can visualize available data with the following types of visualization : <ul><li>one parameter by plateform</li><li>one parameter by many plateforms</li><li>differents parameters by plateform</li><li>2D visualizations</li></ul>
+data.visualization.general.text2=You can visualize up two differents parameters at the same time for many plateforms
+data.visualization.general.example=Examples of time series :
+data.visualization.general.example.param.site=Ozone at the LHVP
+data.visualization.general.example.param.sites=Ozone at the LHVP and the SIRTA
+data.visualization.general.example.params.site=Ozone and Temperature at the SIRTA
+data.visualization.general.example.params.sites=Ozone (at the LHVP and SIRTA) and Temperature (at the SIRTA)
+data.visualization.general.example.2D=Example of 2D :
+
+####################### VISUALIZATION #######################
 inWork=Work in progress..
 all.visualization=Visualization
Index: /ether_megapoli/trunk/web/src/com/ether/Controller.java
===================================================================
--- /ether_megapoli/trunk/web/src/com/ether/Controller.java	(revision 196)
+++ /ether_megapoli/trunk/web/src/com/ether/Controller.java	(revision 197)
@@ -50,6 +50,6 @@
             throws ServiceException
     {
-//        final List<Plateforme> plateforms = _etherService.getAllPlateforms();
-        final List<Plateforme> plateforms = BouchonHelper.createPlateforms();
+        final List<Plateforme> plateforms = _etherService.getAllPlateforms();
+//        final List<Plateforme> plateforms = BouchonHelper.createPlateforms();
 
         final Map<String, Object> model = new HashMap<String, Object>();
@@ -69,6 +69,6 @@
             throws ServiceException, EtherException
     {
-//        final List<Parametre> parametersByPlateform = _etherService.getParametersByPlateformId( plateformId );
-        final List<Parametre> parametersByPlateform = BouchonHelper.createParameters( plateformId );
+        final List<Parametre> parametersByPlateform = _etherService.getParametersByPlateformId( plateformId );
+//        final List<Parametre> parametersByPlateform = BouchonHelper.createParameters( plateformId );
 
         final JSONObject result = new JSONObject();
Index: /ether_megapoli/trunk/web/src/com/ether/ControllerPlot.java
===================================================================
--- /ether_megapoli/trunk/web/src/com/ether/ControllerPlot.java	(revision 196)
+++ /ether_megapoli/trunk/web/src/com/ether/ControllerPlot.java	(revision 197)
@@ -113,11 +113,11 @@
                 final Integer plateformId = (Integer) pIdPIdList.get( 0 ).getFirstValue();
                 final Integer parameterId = (Integer) pIdPIdList.get( 0 ).getSecondValue();
-//                final Data valuesLists = _etherService.getListsByPlateformByParameterByPeriodFor2D( plateformId, parameterId, formatedDateBegin, formatedDateEnd );
-                final Data<List, List, List> valuesLists = BouchonHelper.createValuesFor2D( 50 );
+                final Data valuesLists = _etherService.getListsByPlateformByParameterByPeriodFor2D( plateformId, parameterId, formatedDateBegin, formatedDateEnd );
+//                final Data<List, List, List> valuesLists = BouchonHelper.createValuesFor2D( 50 );
                 megapoliPlot.setData( valuesLists );
 
                 megapoliPlot.setTimeSerie( false );
                 megapoliPlot.setLegendToHide( false );
-                megapoliPlot.setValuesNumber( ( valuesLists.getFirstArray() ).size() );
+                megapoliPlot.setValuesNumber( ( (ArrayList) valuesLists.getFirstArray() ).size() );
             }
 
Index: /ether_megapoli/trunk/web/visualization/visu.jsp
===================================================================
--- /ether_megapoli/trunk/web/visualization/visu.jsp	(revision 196)
+++ /ether_megapoli/trunk/web/visualization/visu.jsp	(revision 197)
@@ -13,7 +13,11 @@
     <tiles:put name="insertCss" type="string">
         <ether:htmlCss cssFile="ether"/>
+        <ether:htmlCss cssFile="visu_parameter_by_pf"/>
+        <ether:htmlCss cssFile="slimbox-1.8/css/slimbox"/>
     </tiles:put>
 
     <tiles:put name="insertJsOrJsp" type="string">
+        <ether:htmlJs jsFile="slimbox-1.8/js/mootools"/>
+        <ether:htmlJs jsFile="slimbox-1.8/js/slimbox"/>
     </tiles:put>
 
@@ -26,7 +30,72 @@
 
     <tiles:put name="body" type="string">
-        - Liste des sites et types de mesure<br>
-        - Photo des stations<br>
-        - etc...
+        <div class="textExamples">
+            <bean:message key="data.visualization.general.text"/>
+            <bean:message key="data.visualization.general.text2"/>
+        </div>
+
+        <BR/>
+
+        <div class="textExamples"><bean:message key="data.visualization.general.example"/></div>
+        <table border="1" width="100%">
+            <tr>
+                <td width="25%">
+                    <div class="textExamplesTD"><bean:message key="data.visualization.general.example.param.site"/></div>
+                </td>
+                <td width="25%">
+                    <div class="textExamplesTD"><bean:message key="data.visualization.general.example.param.sites"/></div>
+                </td>
+                <td width="25%">
+                    <div class="textExamplesTD"><bean:message key="data.visualization.general.example.params.site"/></div>
+                </td>
+                <td width="25%">
+                    <div class="textExamplesTD"><bean:message key="data.visualization.general.example.params.sites"/></div>
+                </td>
+            </tr>
+
+            <tr>
+                <td>
+                    <center>
+                        <a href="/Megapoli/resources/images/CaptureOzone.png" rel="lightbox" title="<bean:message key="data.visualization.general.example.param.site"/>">
+                            <img src="/Megapoli/resources/images/CaptureOzone.png" height="150px" width="150px" class="imageExamples">
+                        </a>
+                    </center>
+                </td>
+                <td>
+                    <center>
+                        <a href="/Megapoli/resources/images/Capture2Ozones.png" rel="lightbox" title="<bean:message key="data.visualization.general.example.param.sites"/>">
+                            <img src="/Megapoli/resources/images/Capture2Ozones.png" height="150px" width="150px" class="imageExamples">
+                        </a>
+                    </center>
+                </td>
+                <td>
+                    <center>
+                        <a href="/Megapoli/resources/images/Capture1Ozone1TempPoints.png" rel="lightbox" title="<bean:message key="data.visualization.general.example.params.site"/>">
+                            <img src="/Megapoli/resources/images/Capture1Ozone1TempPoints.png" height="150px" width="150px" class="imageExamples">
+                        </a>
+                    </center>
+                </td>
+                <td>
+                    <center>
+                        <a href="/Megapoli/resources/images/Capture2Ozones1Temp.png" rel="lightbox" title="<bean:message key="data.visualization.general.example.params.sites"/>">
+                            <img src="/Megapoli/resources/images/Capture2Ozones1Temp.png" height="150px" width="150px" class="imageExamples">
+                        </a>
+                    </center>
+                </td>
+            </tr>
+        </table>
+
+        <BR/>
+
+        <div class="textExamples"><bean:message key="data.visualization.general.example.2D"/></div>
+        <table border="1">
+            <tr>
+                <td>
+                    <center><img src="/Megapoli/resources/images/Capture2Ozones1Temp.png" height="150px" width="150px"
+                                 class="imageExamples"></center>
+                </td>
+            </tr>
+        </table>
+
     </tiles:put>
 
