add labels to Station map
This commit is contained in:
parent
03cc6a475b
commit
f0ea809813
2 changed files with 38 additions and 12 deletions
|
|
@ -12,9 +12,19 @@
|
||||||
floatval($station['latitude'])
|
floatval($station['latitude'])
|
||||||
);
|
);
|
||||||
$coordinates[] = $coordinate;
|
$coordinates[] = $coordinate;
|
||||||
|
// Marker
|
||||||
$features[] = array(
|
$features[] = array(
|
||||||
'type' => 'Feature',
|
'type' => 'Feature',
|
||||||
'id' => $station['id'],
|
'id' => $station['id'],
|
||||||
|
'geometry' => array(
|
||||||
|
'type' => 'Point',
|
||||||
|
'coordinates' => $coordinate
|
||||||
|
)
|
||||||
|
);
|
||||||
|
// Label
|
||||||
|
$features[] = array(
|
||||||
|
'type' => 'Feature',
|
||||||
|
'id' => $station['id'].'-label',
|
||||||
'properties' => array(
|
'properties' => array(
|
||||||
'name' => $station['title'],
|
'name' => $station['title'],
|
||||||
),
|
),
|
||||||
|
|
|
||||||
|
|
@ -171,20 +171,36 @@
|
||||||
var styles = [];
|
var styles = [];
|
||||||
var geometry = feature.getGeometry();
|
var geometry = feature.getGeometry();
|
||||||
if(geometry instanceof ol.geom.Point) {
|
if(geometry instanceof ol.geom.Point) {
|
||||||
// Point styling
|
var name = feature.get('name');
|
||||||
styles.push(
|
if(name) {
|
||||||
new ol.style.Style({
|
// Label styling
|
||||||
text: new ol.style.Text({
|
styles.push(
|
||||||
//text: '\uf041',
|
new ol.style.Style({
|
||||||
text: '\uf276',
|
text: new ol.style.Text({
|
||||||
font: 'normal 28px FontAwesome',
|
text: name,
|
||||||
textBaseline: 'Bottom',
|
textBaseline: 'Bottom',
|
||||||
fill: new ol.style.Fill({
|
offsetY: 14,
|
||||||
color: '#0F373C'
|
scale: 1.2
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
})
|
);
|
||||||
);
|
}
|
||||||
|
else {
|
||||||
|
// Point styling
|
||||||
|
styles.push(
|
||||||
|
new ol.style.Style({
|
||||||
|
text: new ol.style.Text({
|
||||||
|
//text: '\uf041',
|
||||||
|
text: '\uf276',
|
||||||
|
font: 'normal 28px FontAwesome',
|
||||||
|
textBaseline: 'Bottom',
|
||||||
|
fill: new ol.style.Fill({
|
||||||
|
color: '#0F373C'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
})
|
||||||
|
);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
else if(geometry instanceof ol.geom.LineString) {
|
else if(geometry instanceof ol.geom.LineString) {
|
||||||
// Line styling
|
// Line styling
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue