Browse Source

crosshair behavior after zoom out

merge-requests/17/merge
Alexander Velikiy 3 years ago
parent
commit
3357e44927
  1. 2
      dist/index.js
  2. 2
      package.json
  3. 9
      src/index.ts

2
dist/index.js vendored

File diff suppressed because one or more lines are too long

2
package.json

@ -1,6 +1,6 @@
{
"name": "@chartwerk/line-pod",
"version": "0.4.6",
"version": "0.4.7",
"description": "Chartwerk line chart",
"main": "dist/index.js",
"scripts": {

9
src/index.ts

@ -176,6 +176,7 @@ export class LinePod extends ChartwerkPod<LineTimeSerie, LineOptions> {
}
updateCrosshair(): void {
this.crosshair.selectAll('circle').remove();
// Core doesn't know anything about crosshair circles, It is only for line pod
this.appendCrosshairCircles();
}
@ -188,9 +189,12 @@ export class LinePod extends ChartwerkPod<LineTimeSerie, LineOptions> {
}
appendCrosshairCircle(serieIdx: number): void {
// TODO: cx, cy - hacks to hide circles after zoom out(can be replaced with display: none)
this.crosshair.append('circle')
.attr('class', `crosshair-circle-${serieIdx} crosshair-background`)
.attr('r', CROSSHAIR_BACKGROUND_RAIDUS)
.attr('cx', -CROSSHAIR_BACKGROUND_RAIDUS)
.attr('cy', -CROSSHAIR_BACKGROUND_RAIDUS)
.attr('clip-path', `url(#${this.rectClipId})`)
.attr('fill', this.getSerieColor(serieIdx))
.style('opacity', CROSSHAIR_BACKGROUND_OPACITY)
@ -198,6 +202,8 @@ export class LinePod extends ChartwerkPod<LineTimeSerie, LineOptions> {
this.crosshair
.append('circle')
.attr('cx', -CROSSHAIR_CIRCLE_RADIUS)
.attr('cy', -CROSSHAIR_CIRCLE_RADIUS)
.attr('class', `crosshair-circle-${serieIdx}`)
.attr('clip-path', `url(#${this.rectClipId})`)
.attr('fill', this.getSerieColor(serieIdx))
@ -469,7 +475,8 @@ export class LinePod extends ChartwerkPod<LineTimeSerie, LineOptions> {
this.renderMetrics();
this.renderXAxis();
this.renderYAxis();
this.renderGrid()
this.renderGrid();
this.onMouseOver();
if(this.options.eventsCallbacks !== undefined && this.options.eventsCallbacks.zoomOut !== undefined) {
let xAxisMiddleValue: number = this.xScale.invert(this.width / 2);

Loading…
Cancel
Save