本文整理汇总了TypeScript中d3.scalePow函数的典型用法代码示例。如果您正苦于以下问题:TypeScript scalePow函数的具体用法?TypeScript scalePow怎么用?TypeScript scalePow使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。
在下文中一共展示了scalePow函数的6个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: drawOpacityLegend
function drawOpacityLegend() {
d3.select("#heatmap-opacity-legend").selectAll("rect").remove();
let legend = d3.select("#heatmap-opacity-legend");
let legendWidth = Math.floor($(d3.select("#heatmap-opacity-legend").node()).outerWidth());
let legendHeight = d3.select("#heatmap-opacity-legend").attr("height");
let legendOpacityScale;
if (panel.color.colorScale === 'linear') {
legendOpacityScale = d3.scaleLinear()
.domain([0, legendWidth])
.range([0, 1]);
} else if (panel.color.colorScale === 'sqrt') {
legendOpacityScale = d3.scalePow().exponent(panel.color.exponent)
.domain([0, legendWidth])
.range([0, 1]);
}
let rangeStep = 1;
let valuesRange = d3.range(0, legendWidth, rangeStep);
var legendRects = legend.selectAll(".heatmap-opacity-legend-rect").data(valuesRange);
legendRects.enter().append("rect")
.attr("x", d => d)
.attr("y", 0)
.attr("width", rangeStep)
.attr("height", legendHeight)
.attr("stroke-width", 0)
.attr("fill", panel.color.cardColor)
.style("opacity", d => {
return legendOpacityScale(d);
});
}
示例2: drawSimpleOpacityLegend
function drawSimpleOpacityLegend(elem, options) {
let legendElem = $(elem).find('svg');
clearLegend(elem);
let legend = d3.select(legendElem.get(0));
let legendWidth = Math.floor(legendElem.outerWidth());
let legendHeight = legendElem.attr("height");
if (legendWidth) {
let legendOpacityScale;
if (options.colorScale === 'linear') {
legendOpacityScale = d3.scaleLinear()
.domain([0, legendWidth])
.range([0, 1]);
} else if (options.colorScale === 'sqrt') {
legendOpacityScale = d3.scalePow().exponent(options.exponent)
.domain([0, legendWidth])
.range([0, 1]);
}
let rangeStep = 10;
let valuesRange = d3.range(0, legendWidth, rangeStep);
var legendRects = legend.selectAll(".heatmap-opacity-legend-rect").data(valuesRange);
legendRects.enter().append("rect")
.attr("x", d => d)
.attr("y", 0)
.attr("width", rangeStep)
.attr("height", legendHeight)
.attr("stroke-width", 0)
.attr("fill", options.cardColor)
.style("opacity", d => legendOpacityScale(d));
}
}
示例3: setOpacityScale
function setOpacityScale(maxValue) {
if (panel.color.colorScale === 'linear') {
opacityScale = d3.scaleLinear()
.domain([0, maxValue])
.range([0, 1]);
} else if (panel.color.colorScale === 'sqrt') {
opacityScale = d3.scalePow().exponent(panel.color.exponent)
.domain([0, maxValue])
.range([0, 1]);
}
}
示例4: getOpacityScale
export function getOpacityScale(options, maxValue, minValue = 0) {
let legendOpacityScale;
if (options.colorScale === 'linear') {
legendOpacityScale = d3.scaleLinear()
.domain([minValue, maxValue])
.range([0, 1]);
} else if (options.colorScale === 'sqrt') {
legendOpacityScale = d3.scalePow().exponent(options.exponent)
.domain([minValue, maxValue])
.range([0, 1]);
}
return legendOpacityScale;
}
示例5: drawSimpleOpacityLegend
function drawSimpleOpacityLegend(elem, options) {
const legendElem = $(elem).find('svg');
clearLegend(elem);
const legend = d3.select(legendElem.get(0));
const legendWidth = Math.floor(legendElem.outerWidth());
const legendHeight = legendElem.attr('height');
if (legendWidth) {
let legendOpacityScale;
if (options.colorScale === 'linear') {
legendOpacityScale = d3
.scaleLinear()
.domain([0, legendWidth])
.range([0, 1]);
} else if (options.colorScale === 'sqrt') {
legendOpacityScale = d3
.scalePow()
.exponent(options.exponent)
.domain([0, legendWidth])
.range([0, 1]);
}
const rangeStep = 10;
const valuesRange = d3.range(0, legendWidth, rangeStep);
const legendRects = legend.selectAll('.heatmap-opacity-legend-rect').data(valuesRange);
legendRects
.enter()
.append('rect')
.attr('x', d => d)
.attr('y', 0)
.attr('width', rangeStep)
.attr('height', legendHeight)
.attr('stroke-width', 0)
.attr(
'fill',
getColorFromHexRgbOrName(
options.cardColor,
contextSrv.user.lightTheme ? GrafanaThemeType.Light : GrafanaThemeType.Dark
)
)
.style('opacity', d => legendOpacityScale(d));
}
}
示例6: scaleFor
export function scaleFor(column: ChartColumn<any>, values: number[], minRange: number, maxRange: number, scaleName: string | null | undefined): d3.ScaleContinuousNumeric<number, number> {
if (scaleName == "ZeroMax")
return d3.scaleLinear()
.domain([0, d3.max(values)!])
.range([minRange, maxRange])
.nice();
if (scaleName == "MinMax") {
if (column.type == "Date" || column.type == "DateTime") {
const scale = d3.scaleTime()
.domain(values)
.range([minRange, maxRange]);
const f = function (d: string) { return scale(new Date(d)); } as any as d3.ScaleContinuousNumeric<number, number>;
f.ticks = scale.ticks as any;
f.tickFormat = scale.tickFormat as any;
return f;
}
else {
return d3.scaleLinear()
.domain([d3.min(values)!, d3.max(values)!])
.range([minRange, maxRange])
.nice();
}
}
if (scaleName == "Log")
return d3.scaleLog()
.domain([d3.min(values)!, d3.max(values)!])
.range([minRange, maxRange])
.nice();
if (scaleName == "Sqrt")
return d3.scalePow().exponent(.5)
.domain([d3.min(values)!, d3.max(values)!])
.range([minRange, maxRange]);
throw Error("Unexpected scale: " + scaleName);
}