OpenLayers3和Javascript-矢量不显示

Question

我在使用OpenLayers3时遇到了一些问题，并试图显示矢量层。 我正在使用C＃从SQL Server收集几何并将其传递给Javascript。 从那里开始，应该将此代码绘制在地图上（该代码改编自http://www.c-sharpcorner.com/article/getting-started-with-openlayers-3-and-spatial-data/ ） 。

<script type="text/javascript">
        //services for our shapes
        var GeoArray = <%=JavaScript.Serialize(this.CGeo) %>;
        var wktReader = new ol.format.WKT();
        var featureCollection = [];
        //start getting, styling and drawing shapes
        for (var i = 0; i < GeoArray.length; i++)
        {
            var feature = wktReader.readFeature(GeoArray[i]);
            feature.getGeometry().transform('EPSG:4326', 'EPSG:3857');
            feature.setStyle(new ol.style.Style(
            {
                stroke: new ol.style.Stroke(
                {
                    color: 'red',
                    width: 3
                }),
                fill: new ol.style.Fill(
                {
                    color: 'rgba(255, 0, 0, 1)'
                })
            }));
            featureCollection.push(feature);
        }
        //create our vector source and layer
        var Vsource = new ol.source.Vector({features: featureCollection});
        var vectorLayer = new ol.layer.Vector({source: Vsource});
        //define our map and basemap layer
        var osmLayer = new ol.layer.Tile(
        {
            source: new ol.source.OSM()
        });
        var map = new ol.Map(
        {
            layers: [osmLayer, vectorLayer],
            target: 'map',
            view: new ol.View(
            {
                center: [0, 0],
                zoom: 2
            })
        });
    </script>

我们确实从C＃中拾取了形状（它们都是多边形，我已经做了一些alert（GeoArray.length）和alert（featureCollection.length）调用，它们都返回了返回的数量），但是它们是没有被吸引。

顺便说一句，我们使用的是坐标系EPSG：3111，但是当我使用它（与EPSG：3857相对）时，它将根本无法工作（无法获得属性）。 但是，即使我指定它是3857（不是），它也应该绘制，只是对齐不正确（即使移除了平移线也没有任何反应）。

Answer 1

好的，我试图在OpenLayers3中使用旧的OpenLayers代码。 对于有兴趣的人（目前仅加载一项功能）提供新答案：

<script>
        //services for our shapes
        var GeoArray = <%=JavaScript.Serialize(this.CGeo) %>;
        var format = new ol.format.WKT();
        var featureCollection=[];
        var feature=format.readFeature(GeoArray[1],
        {
            dataProjection: 'EPSG:3111',
            featureProjection: 'EPSG:3857'
        });
        var VLayer = new ol.layer.Vector({
            source: new ol.source.Vector({
                features: [feature]
            })
        });
        //define our map and basemap layer
        var osmLayer = new ol.layer.Tile(
        {
            source: new ol.source.OSM()
        });
        var map = new ol.Map(
        {
            layers: [osmLayer, VLayer],
            target: 'map',
            view: new ol.View(
            {
                center: [0, 0],
                zoom: 2
            })
        });
    </script>