gistfile1.txt

goog.require('ol.Map');
goog.require('ol.RendererHint');
goog.require('ol.View2D');
goog.require('ol.layer.Vector');
goog.require('ol.proj.Projection');
goog.require('ol.source.GeoJSON');
goog.require('ol.style.Fill');
goog.require('ol.style.Stroke');
goog.require('ol.style.Style');

var styleArray2 = [new ol.style.Style({
  fill: new ol.style.Fill({
    color: 'rgba(255, 0, 0, 0.2)'
  }),
  stroke: new ol.style.Stroke({
    color: 'red',
    width: 2
  })
})];

var source = new ol.source.GeoJSON({
    projection: 'EPSG:28992',
    url: 'data/geojson/nl.geojson'
  });

source.once('change', function() {
  switch (source.getState()) {
  case ol.source.State.READY:
    map.getView().fitExtent(source.getExtent(), map.getSize());
    break;
  case ol.source.State.ERROR:
    break;
  }
});

var styleCache = {};
var vectorLayer = new ol.layer.Vector({
  source: source,
  styleFunction: function(feature, resolution) {
    return styleArray2;
  }
});

var map = new ol.Map({
  layers: [
    vectorLayer
  ],
  renderer: ol.RendererHint.CANVAS,
  target: 'map',
  view: new ol.View2D({
    center: [143343,375546],
    zoom: 17 ,
    projection: ol.proj.get('EPSG:28992')
  })
});

// in the HTML I used this proj4js definition:
    <script src="http://cdnjs.cloudflare.com/ajax/libs/proj4js/1.1.0/proj4js-compressed.js" type="text/javascript"></script>
    <script type="text/javascript">
Proj4js.defs["EPSG:28992"] = "+title=Amersfoort / RD New +proj=sterea +lat_0=52.15616055555555 +lon_0=5.38763888888889 +k=0.9999079 +x_0=155000 +y_0=463000 +ellps=bessel +units=m +no_defs";
    </script>