Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
}
xRange.push(width);
xDomain.push(allDomain[1]);
xTicks.push(allDomain[1]);
this.x.domain(xDomain);
this.x.range(xRange);
this.x2.domain(xDomain);
this.x2.range(xRange);
this.visibleXAxis.tickValues(xTicks);
this.extremesXAxis.tickValues(xTicks);
select('#visible_axis')
.call(this.visibleXAxis);
select('#extremes_axis')
.attr('opacity', .6);
select('#extremes_axis')
.call(this.extremesXAxis);
select('#extremes_axis')
.attr('opacity', .6);
select('#visible_axis')
.selectAll('text')
//Offsets for axisBottom
// .attr('dx', '-.1em')
// .attr('dy', '.65em')
const length = data.length;
const height = 60 - margin.top - margin.bottom;
width -= 30;
const x = scaleLinear()
.range([0, width])
.domain([0, length]);
const y = scaleLinear()
.range([height, 0])
.domain([0, yMax]);
// Construct the SVG canvas.
svg = select(element)
.append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform", `translate(${margin.left},${margin.top})`);
if (data) {
const areaDrawer = area()
.x((d, i) => x(i))
.y0(d => y(d))
.y1(height);
svg.append("path")
.datum(data)
.attr("class", "depth-area")
.attr("d", areaDrawer);
draw(explanation) {
let scale = scaleLinear().domain([0,max(explanation.features.map(x=>Math.abs(x.effect)))]).range([0,100]);
window.scale = scale;
console.log("sdf", [0,extent(explanation.features.map(x=>x.effect))[1]])
let fmt = format('.2');
let incomingItems = select(this.container).selectAll('.element').data(reverse(sortBy(explanation.features, 'effect')))
.enter().append('div');
incomingItems.append('div').classed('simple-list-label', true).text(x => `${x.name} (${fmt(x.effect)})`)
incomingItems.append('div')
.classed('simple-list-padding', true)
.style('width', x=> (x.effect > 0 ? 100 : 100 + scale(x.effect))+"px");
incomingItems.append('div')
.classed('simple-list-value', true)
.style('width', x=>{ let v = Math.abs(scale(x.effect)); console.log(v); return v+"px";})
.style('background', x=> x.effect > 0 ? '#00a' : '#a00');
}
}
.on('dblclick', (elem, index, textElements) => {
this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'display', 'initial');
this.editedElement = elem;
select(textElements[index]).attr('visibility', 'hidden');
select(textElements[index]).classed('editingMode', true);
this.editingDrawingId = textElements[index].parentElement.parentElement.getAttribute('drawing_id');
var transformData = textElements[index].parentElement.getAttribute('transform').split(/\(|\)/);
var x = Number(transformData[1].split(/,/)[0]) + this.context.getZeroZeroTransformationPoint().x + this.context.transformation.x;
var y = Number(transformData[1].split(/,/)[1]) + this.context.getZeroZeroTransformationPoint().y + this.context.transformation.y;
this.leftPosition = x.toString() + 'px';
this.topPosition = y.toString() + 'px';
this.temporaryTextElement.nativeElement.innerText = elem.text;
this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'color', elem.fill);
this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'font-family', elem.font_family);
this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'font-size', `${elem.font_size}pt`);
this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'font-weight', elem.font_weight);
ref: function ref(node) {
return select(node).call(drawGrid(horizontal, xScale, height, yScale, width, xAxisTicks, yAxisTicks));
}
}), title && React.createElement(Title, {
_zoomConfig = () =>
d3Select(`#${this.state.id}-${CONST.GRAPH_WRAPPER_ID}`).call(
d3Zoom()
.scaleExtent([this.state.config.minZoom, this.state.config.maxZoom])
.on('zoom', this._zoomed)
);
export function uiFieldCheck(field, context) {
var dispatch = d3_dispatch('change');
var options = field.strings && field.strings.options;
var values = [];
var texts = [];
var input = d3_select(null);
var text = d3_select(null);
var label = d3_select(null);
var reverser = d3_select(null);
var _impliedYes;
var _entityID;
var _value;
if (options) {
for (var k in options) {
values.push(k === 'undefined' ? undefined : k);
texts.push(field.t('options.' + k, { 'default': options[k] }));
}
} else {
values = [undefined, 'yes'];
.on('mouseout', function() {
select(this).style('opacity', 0);
})
.call(_drag);
nextProps.disableScroll &&
this.props.currentState !== nextProps.currentState
) {
d3.selectAll(`#idyll-scroll-${this.id} .idyll-step`)
.filter((d, i) => {
return nextProps.currentState === this.SCROLL_NAME_MAP[i];
})
.node()
.scrollIntoView({ behavior: 'smooth' });
}
if (
nextProps.disableScroll &&
(!nextProps.currentStep ||
nextProps.currentStep < Object.keys(this.SCROLL_STEP_MAP).length - 1)
) {
d3.select('body').style('overflow', 'hidden');
}
}
_updateBrush() {
if (this.props.data.length === 0) {
return;
}
d3Select(this.densityBrushRef.current)
.call(this.brush);
}