JSFiddle - React, Tailwind, and code Playground

by Pavlos Tsagkis

HTML

<link rel="stylesheet" href="https://openlayers.org/en/v3.20.1/css/ol.css">
<script src="https://openlayers.org/en/v3.20.1/build/ol.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.15/proj4.js"></script>

JavaScript

proj4.defs("EPSG:2100","+proj=tmerc +lat_0=0 +lon_0=24 +k=0.9996 +x_0=500000 +y_0=0 +ellps=GRS80 +towgs84=-199.87,74.79,246.62,0,0,0,0 +units=m +no_defs");
//you can get the projection as an object as follows
var proj2100 = ol.proj.get('EPSG:2100');

//@ahocevar To add the extent (if you need it), do
ol.proj.get('EPSG:2100').setExtent([104022.946289, 3850785.500488, 1007956.563293, 4624047.765686]);
//@ahocevar `ol.proj.transform` is not a class, so the `new` keyword should not be used
var center1 = ol.proj.transform([21.767997, 39.556105], 'EPSG:4326', 'EPSG:2100');
var center2 = ol.proj.transform([21.767997, 39.556105], 'EPSG:4326', proj2100);
console.log(center1);
console.log(center2);