本文整理汇总了TypeScript中d3-interpolate.interpolateRgb函数的典型用法代码示例。如果您正苦于以下问题:TypeScript interpolateRgb函数的具体用法?TypeScript interpolateRgb怎么用?TypeScript interpolateRgb使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。
在下文中一共展示了interpolateRgb函数的3个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: function
updateTransition = updateTransition.tween('fillColor', function (d, i, group) {
let circle = this;
let interpolator = interpolateRgb(circle.getAttribute('fill'), d.color); // datum type CircleDatum
console.log('Radius ', this.r.baseVal.value); // this type SVGCircleElement
return function (t) {
circle.setAttribute('fill', interpolator(t));
};
});
示例2: function
updateTransition = updateTransition.tween('fillColor', function (d, i, g) {
let that: SVGCircleElement = this;
// let that2: HTMLElement = this; // fails, type mismatch
let datum: CircleDatum = d;
let index: number = i;
let group: SVGCircleElement[] | ArrayLike<SVGCircleElement> = g;
let c: string | null = that.getAttribute('fill');
let interpolator = interpolateRgb(c ? c : 'blue', d.color); // datum type CircleDatum
console.log('Radius ', this.r.baseVal.value); // this type SVGCircleElement
return function (t) {
that.setAttribute('fill', interpolator(t));
};
});
示例3: iZoom
iZoom = d3Interpolate.interpolateZoom([50, 50, 300], [100, 100, 500]);
zoom = iZoom(0.5);
console.log('Recommended transition duration = %d', iZoom.duration);
// test quantize(interpolator, n) signature ------------------------------------------------
arrNum = d3Interpolate.quantize(d3Interpolate.interpolateRound(-1, 2), 4); // infered template parameter type
arrStr = d3Interpolate.quantize<string>(d3Interpolate.interpolateString('-1', '2'), 4); // explicit template parameter typing
// arrStr = d3Interpolate.quantize<string>(d3Interpolate.interpolateRound(-1, 2), 4); // test fails, due to explicit typing v argument type mismatch
// test interpolateRgb(a, b) signatures ----------------------------------------------------------------
// without gamma correction
iString = d3Interpolate.interpolateRgb('seagreen', 'steelblue');
iString = d3Interpolate.interpolateRgb(d3Color.rgb('seagreen'), d3Color.hcl('steelblue'));
iString = d3Interpolate.interpolateRgb(d3Color.rgb('seagreen'), d3Hsv.hsv('steelblue'));
str = iString(0.5);
// with gamma correction
iString = d3Interpolate.interpolateRgb.gamma(2.2)('purple', 'orange');
// test interpolateRgbBasis(color) and interpolateRgbBasisClosed(color) signatures -------------------------
iString = d3Interpolate.interpolateRgbBasis(['seagreen', d3Color.rgb('steelblue'), 'rgb(100, 100, 100)']);
iString = d3Interpolate.interpolateRgbBasis(['seagreen', d3Hsv.hsv('steelblue'), 'rgb(100, 100, 100)']);
iString = d3Interpolate.interpolateRgbBasisClosed(['seagreen', d3Hsv.hsv('steelblue'), 'rgb(100, 100, 100)']);
// test interpolateHsl(a, b) and interpolateHslLong(a, b)----------------------------------------------------------------