Show both Proj4js and custom transform functions in examples

examples/wms-custom-proj.js

@@ -5,24 +5,33 @@ goog.require('ol.control');
 goog.require('ol.control.ScaleLine');
 goog.require('ol.layer.Tile');
 goog.require('ol.proj');
+goog.require('ol.proj.Projection');
 goog.require('ol.source.TileWMS');
 
 
-// EPSG:21781 is known to Proj4js because its definition was loaded in the html.
-var projection = ol.proj.addProjection({
+var projection = new ol.proj.Projection({
   code: 'EPSG:21781',
   // The extent is used to determine zoom level 0. Recommended values for a
   // projection's validity extent can be found at http://epsg.io/.
   extent: [485869.5728, 76443.1884, 837076.5648, 299941.7864],
-  // Use data from proj4js to configure the projection's units.
-  units: proj4.defs('EPSG:21781').units
+  units: 'm'
 });
-// Proj4js provides transform functions between its configured projections.
-// The transform is needed for the ScaleLine control. Otherwise this example
-// would also work without transform functions.
-var transform = proj4('EPSG:21781');
-ol.proj.addCoordinateTransforms('EPSG:4326', projection, transform.forward,
-    transform.inverse);
+ol.proj.addProjection(projection);
+// WGStoCHx, WGStoCHy, CHtoWGSlng and CHtoWGSlat are defined in a script block
+// in the html.
+ol.proj.addCoordinateTransforms('EPSG:4326', projection,
+    function(coordinate) {
+      return [
+        WGStoCHy(coordinate[1], coordinate[0]),
+        WGStoCHx(coordinate[1], coordinate[0])
+      ];
+    },
+    function(coordinate) {
+      return [
+        CHtoWGSlng(coordinate[0], coordinate[1]),
+        CHtoWGSlat(coordinate[0], coordinate[1])
+      ];
+    });
 
 var extent = [420000, 30000, 900000, 350000];
 var layers = [
@@ -72,7 +81,7 @@ var map = new ol.Map({
   target: 'map',
   view: new ol.View({
     projection: projection,
-    center: [660000, 190000],
+    center: ol.proj.transform([8.23, 46.86], 'EPSG:4326', 'EPSG:21781'),
     extent: extent,
     zoom: 2
   })