Docker/Maybe
Docker/Maybe
1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-07-21 14:19:39 +02:00
Code Issues Releases Activity Actions

Fix minified JS in prod for chart controller

Browse source
This commit is contained in:
Zach Gollwitzer 2024-10-11 11:37:33 -04:00
parent a21061fb56
commit 8f8988c03a
1 changed files with 12 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

25
app/javascript/controllers/time_series_chart_controller.js
View file

@ -11,12 +11,12 @@ export default class extends Controller {
usePercentSign: Boolean usePercentSign: Boolean
} }
#d3SvgMemo = null #d3SvgMemo = null;
#d3GroupMemo = null #d3GroupMemo = null;
#d3Tooltip = null #d3Tooltip = null;
#d3InitialContainerWidth = 0 #d3InitialContainerWidth = 0;
#d3InitialContainerHeight = 0 #d3InitialContainerHeight = 0;
#normalDataPoints = [] #normalDataPoints = [];
connect() { connect() {
this.#install() this.#install()
@ -181,7 +181,7 @@ export default class extends Controller {
.call( .call(
d3 d3
.axisBottom(this.#d3XScale) .axisBottom(this.#d3XScale)
.tickValues([ this.#normalDataPoints[0].date, this.#normalDataPoints[this.#normalDataPoints.length - 1].date ]) .tickValues([this.#normalDataPoints[0].date, this.#normalDataPoints[this.#normalDataPoints.length - 1].date])
.tickSize(0) .tickSize(0)
.tickFormat(d3.timeFormat("%d %b %Y")) .tickFormat(d3.timeFormat("%d %b %Y"))
) )
@ -247,7 +247,6 @@ export default class extends Controller {
.style("fill", `url(#${this.element.id}-trendline-gradient)`) .style("fill", `url(#${this.element.id}-trendline-gradient)`)
} }
#drawTooltip() { #drawTooltip() {
this.#d3Tooltip = d3 this.#d3Tooltip = d3
.select(`#${this.element.id}`) .select(`#${this.element.id}`)
@ -345,7 +344,7 @@ export default class extends Controller {
} }
#tooltipTemplate(datum) { #tooltipTemplate(datum) {
return(` return (`
<div style="margin-bottom: 4px; color: ${tailwindColors.gray[500]};"> <div style="margin-bottom: 4px; color: ${tailwindColors.gray[500]};">
${d3.timeFormat("%b %d, %Y")(datum.date)} ${d3.timeFormat("%b %d, %Y")(datum.date)}
</div> </div>
@ -428,7 +427,7 @@ export default class extends Controller {
.append("svg") .append("svg")
.attr("width", this.#d3InitialContainerWidth) .attr("width", this.#d3InitialContainerWidth)
.attr("height", this.#d3InitialContainerHeight) .attr("height", this.#d3InitialContainerHeight)
.attr("viewBox", [ 0, 0, this.#d3InitialContainerWidth, this.#d3InitialContainerHeight ]) .attr("viewBox", [0, 0, this.#d3InitialContainerWidth, this.#d3InitialContainerHeight])
} }
#createMainGroup() { #createMainGroup() {
@ -502,7 +501,7 @@ export default class extends Controller {
get #d3XScale() { get #d3XScale() {
return d3 return d3
.scaleTime() .scaleTime()
.rangeRound([ 0, this.#d3ContainerWidth ]) .rangeRound([0, this.#d3ContainerWidth])
.domain(d3.extent(this.#normalDataPoints, d => d.date)) .domain(d3.extent(this.#normalDataPoints, d => d.date))
} }
@ -514,7 +513,7 @@ export default class extends Controller {
return d3 return d3
.scaleLinear() .scaleLinear()
.rangeRound([ this.#d3ContainerHeight, 0 ]) .rangeRound([this.#d3ContainerHeight, 0])
.domain([ dataMin - padding, dataMax + padding ]) .domain([dataMin - padding, dataMax + padding])
} }
} }