本文整理匯總了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);
}