add event counts for locations

This commit is contained in:
Lachlan Kermode
2019-01-08 13:00:33 +00:00
parent 56b8677827
commit 899e06d560
5 changed files with 15 additions and 11 deletions

View File

@@ -168,8 +168,10 @@ class Map extends React.Component {
* components in the <g/> div.
*/
styleLocation(location) {
const noEvents = location.events.length
return [
{ fill: 'orange' },
null,
() => noEvents > 1 ? <text className='location-count' dx='-3' dy='4'>{noEvents}</text> : null
]
}

View File

@@ -64,12 +64,12 @@ class MapEvents extends React.Component {
<g
className="location"
transform={`translate(${x}, ${y})`}
onClick={() => this.props.onSelect(location.events)}
>
<circle
className="location-event-marker"
r={7}
style={styles}
onClick={() => this.props.onSelect(events)}
>
</circle>
{extraRender ? extraRender() : null}

View File

@@ -221,9 +221,7 @@ class Timeline extends React.Component {
* components in the <g/> div.
*/
styleDatetime(timestamp) {
return [
{ fill: 'orange' },
]
return []
}
render() {

View File

@@ -35,6 +35,7 @@ const TimelineEvents = ({
<g
className='datetime'
transform={`translate(${getDatetimeX(datetime)}, ${getDatetimeY(datetime)})`}
onClick={() => onSelect(datetime.events)}
>
<circle
className="event"
@@ -42,7 +43,6 @@ const TimelineEvents = ({
cy={0}
style={styleProps}
r={5}
onClick={() => onSelect(datetime.events)}
>
</circle>
{ extraRender ? extraRender() : null }

View File

@@ -165,14 +165,13 @@
* Elements
*/
.location {
cursor: pointer;
}
.location-event-marker {
fill: $event_default;
stroke-width: 0;
cursor: pointer;
&:hover {
fill-opacity: 1;
}
}
.path-polyline {
@@ -180,5 +179,10 @@
stroke-width: 2px;
}
.location-count {
z-index: 100;
fill: #a4a4a4;
}