diff --git a/src/components/d3/renders/line.ts b/src/components/d3/renders/line.ts index 6ac13af..d2a2d13 100644 --- a/src/components/d3/renders/line.ts +++ b/src/components/d3/renders/line.ts @@ -39,6 +39,7 @@ export const renderLine = >( .transition() .duration(chart.animDurationMs ?? 0) .attr('d', line(data as any)) + .attr('stroke-dasharray', String(chart.dash ?? '')) return data } diff --git a/src/components/d3/renders/needle.ts b/src/components/d3/renders/needle.ts index 0532143..8af270e 100644 --- a/src/components/d3/renders/needle.ts +++ b/src/components/d3/renders/needle.ts @@ -27,6 +27,7 @@ export const renderNeedle = >( .attr('x2', (d: any) => xAxis(chart.x(d))) .attr('y1', height - offset.bottom - offset.top) .attr('y2', (d: any) => yAxis(chart.y(d))) + .attr('stroke-dasharray', String(chart.dash ?? '')) return data } diff --git a/src/components/d3/types.ts b/src/components/d3/types.ts index f186338..6c22536 100644 --- a/src/components/d3/types.ts +++ b/src/components/d3/types.ts @@ -35,6 +35,7 @@ export type BaseChartDataset = { animDurationMs?: number point?: Omit afterDraw?: (d: any) => void + dash?: string | number | [string | number, string | number] } export type LineChartDataset = { diff --git a/src/pages/WellOperations/Tvd/index.jsx b/src/pages/WellOperations/Tvd/index.jsx index 2d70ce2..820b2c9 100755 --- a/src/pages/WellOperations/Tvd/index.jsx +++ b/src/pages/WellOperations/Tvd/index.jsx @@ -107,12 +107,13 @@ const plugins = { cursor: { enabled: false } } -const makeDataset = (key, label, color, width, radius) => ({ +const makeDataset = (key, label, color, width, radius, dash) => ({ key, type: 'line', label, color, width, + dash, yAxis: { type: 'linear', accessor: 'depth', @@ -173,7 +174,7 @@ const Tvd = memo(({ idWell: wellId, title, ...other }) => { return [ makeDataset('withoutNpt', 'Факт без НПВ', '#548CFF', 2, radius), makeDataset('plan', 'План', '#EB5353', 2, radius), - makeDataset('predict', 'Прогноз', '#BD4291', 1, radius), + makeDataset('predict', 'Прогноз', '#BD4291', 1, radius, [5, 5]), makeDataset('fact', 'Факт', '#36AE7C', 2, radius), ] }, [pointsEnabled])