我正在尝试从SQL加载一个MultiPolygon到Geo Jason对象并且它无法正常工作..
什么工作(这会创建几何对象)......
<ControlTemplate TargetType="{x:Type TreeViewItem}">
<Grid>
....
<ToggleButton x:Name="Expander" Style="{StaticResource ExpandCollapseToggleStyle}" IsChecked="{Binding Path=IsExpanded, RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press"/>
<Border Name="Bd" Grid.Column="1" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
<ContentPresenter x:Name="PART_Header" ContentSource="Header" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"/>
</Border>
<ItemsPresenter x:Name="ItemsHost" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2" />
//Add code below
<Path Margin="-1000,0,0,0" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" VerticalAlignment="Bottom" Stretch="Fill" StrokeThickness="1" StrokeStartLineCap="Square" StrokeEndLineCap="Square" Stroke="Blue" Data="M 0 0 H 1" />
</Grid>
什么行不通......
var geoJsonObj = {
'type': 'Feature',
'geometry': {
"coordinates": [
[[[-91.0759333619999, 40.15440933399983],
[-91.066378752, 40.154309680999823],
[-91.066282352, 40.157927062999832],
[-91.0751007809999, 40.157994385999814],
[-91.0758658189999, 40.157997289999805],
[-91.075866624, 40.157608482999827],
[-91.0758737049999, 40.157300970999813],
[-91.0759333619999, 40.15440933399983]]]
]
, "type": "MultiPolygon"
}
};
其中webMapValues.geometry是从SQL填充的,其值为...
var geoJsonObj = {
'type': 'Feature',
'geometry': webMapValues.geometry
};
注意唯一的区别是SQL加载的变量中的值在&#34;&#34;引号。
我尝试了一对&#34;格式&#34;解决方案但似乎陷入了死胡同。
非常感谢任何帮助!!
答案 0 :(得分:0)
实际的答案是像这样使用JSON.parse ......
JSON.parse(response.FieldList[key].Shape)
因为从SQL返回的结构已经是Toby Speight的一个正确的GeoJson对象,而我猜的OL3需要一个字符串。
答案 1 :(得分:0)
您需要将JSON字符串解析为一个对象,然后您可以将其与geoJSON对象框架合并并添加到OpenLayers。
var geomStr = '{"coordinates":[[[[-91.0759333619999, 40.15440933399983],[-91.066378752, 40.154309680999823],[-91.066282352, 40.157927062999832],[-91.0751007809999, 40.157994385999814],[-91.0758658189999, 40.157997289999805],[-91.075866624, 40.157608482999827],[-91.0758737049999, 40.157300970999813],[-91.0759333619999, 40.15440933399983]]]],"type":"MultiPolygon"}';
var geoJson = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"geometry": JSON.parse(geomStr)
}]
};
var vectorLayer = new ol.layer.Vector({
source: new ol.source.Vector({
features: new ol.format.GeoJSON().readFeatures(geoJson, {
dataProjection: 'EPSG:4326',
featureProjection: 'EPSG:3857'
})
})
});
var map = new ol.Map({
target: 'map',
controls: [],
layers: [new ol.layer.Tile({
source: new ol.source.OSM()
}), vectorLayer],
view: new ol.View({
center: [0, 0],
zoom: 10
})
});
map.getView().fit(
vectorLayer.getSource().getExtent(),
map.getSize());
&#13;
html, body {
margin: 0;
height: 100%;
width: 100%;
}
#map {
height: 100%;
width: 100%;
}
&#13;
<link href="https://cdnjs.cloudflare.com/ajax/libs/ol3/3.16.0/ol.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ol3/3.16.0/ol.js"></script>
<div id="map"></div>
&#13;