Organize tests

test/rendering/cases/polygon-style/main.js

@@ -0,0 +1,166 @@
+import Feature from '../../../../src/ol/Feature.js';
+import Fill from '../../../../src/ol/style/Fill.js';
+import Map from '../../../../src/ol/Map.js';
+import Polygon from '../../../../src/ol/geom/Polygon.js';
+import Stroke from '../../../../src/ol/style/Stroke.js';
+import Style from '../../../../src/ol/style/Style.js';
+import VectorLayer from '../../../../src/ol/layer/Vector.js';
+import VectorSource from '../../../../src/ol/source/Vector.js';
+import View from '../../../../src/ol/View.js';
+
+const vectorSource = new VectorSource();
+let feature;
+
+// rectangle with 1 hole
+feature = new Feature({
+  geometry: new Polygon([
+    [
+      [-102.5, 75],
+      [-102.5, 115],
+      [-42.5, 115],
+      [-42.5, 75],
+      [-102.5, 75],
+    ],
+    [
+      [-82.5, 87],
+      [-62.5, 87],
+      [-62.5, 103],
+      [-82.5, 103],
+      [-82.5, 87],
+    ],
+  ]),
+});
+
+feature.setStyle(
+  new Style({
+    stroke: new Stroke({
+      width: 4,
+      color: '#000',
+      lineJoin: 'round',
+      lineCap: 'butt',
+    }),
+  })
+);
+vectorSource.addFeature(feature);
+
+// rectangle with 2 holes
+feature = new Feature({
+  geometry: new Polygon([
+    [
+      [-117.5, 47.5],
+      [-117.5, 97.5],
+      [-47.5, 97.5],
+      [-47.5, 47.5],
+      [-117.5, 47.5],
+    ],
+    [
+      [-113.5, 51.5],
+      [-101.5, 51.5],
+      [-101.5, 63.5],
+      [-113.5, 63.5],
+      [-113.5, 51.5],
+    ],
+    [
+      [-67.5, 51.5],
+      [-53.5, 51.5],
+      [-53.5, 63.5],
+      [-67.5, 63.5],
+      [-67.5, 51.5],
+    ],
+  ]),
+});
+
+feature.setStyle(
+  new Style({
+    zIndex: -1,
+    fill: new Fill({
+      color: '#1A5E42',
+    }),
+    stroke: new Stroke({
+      color: '#9696EB',
+      width: 3,
+    }),
+  })
+);
+vectorSource.addFeature(feature);
+
+// rectangle with 1 hole
+feature = new Feature({
+  geometry: new Polygon([
+    [
+      [-22.5, -5],
+      [-22.5, 35],
+      [37.5, 35],
+      [37.5, -5],
+      [-22.5, -5],
+    ],
+    [
+      [-2.5, 7],
+      [17.5, 7],
+      [17.5, 23],
+      [-2.5, 23],
+      [-2.5, 7],
+    ],
+  ]),
+});
+feature.setStyle(
+  new Style({
+    stroke: new Stroke({
+      width: 3,
+      color: '#777',
+      lineDash: [2, 4],
+    }),
+  })
+);
+vectorSource.addFeature(feature);
+
+// rectangle with 2 holes
+feature = new Feature({
+  geometry: new Polygon([
+    [
+      [-37.5, -32.5],
+      [-37.5, 17.5],
+      [32.5, 17.5],
+      [32.5, -32.5],
+      [-37.5, -32.5],
+    ],
+    [
+      [-33.5, -28.5],
+      [-21.5, -28.5],
+      [-21.5, -16.5],
+      [-33.5, -16.5],
+      [-33.5, -28.5],
+    ],
+    [
+      [12.5, -28.5],
+      [26.5, -28.5],
+      [26.5, -16.5],
+      [12.5, -16.5],
+      [12.5, -28.5],
+    ],
+  ]),
+});
+feature.setStyle(
+  new Style({
+    fill: new Fill({
+      color: 'rgba(255, 0, 0, 0.85)',
+    }),
+  })
+);
+vectorSource.addFeature(feature);
+
+new Map({
+  pixelRatio: 1,
+  layers: [
+    new VectorLayer({
+      source: vectorSource,
+    }),
+  ],
+  target: 'map',
+  view: new View({
+    center: [0, 0],
+    resolution: 1,
+  }),
+});
+
+render();