mirror of
https://github.com/apache/superset.git
synced 2024-09-12 00:29:39 -04:00
[deck arcs] add JS hooks for sourceColor & targetColor
This commit is contained in:
parent
2a8cd43881
commit
71866f6a12
@ -242,6 +242,14 @@ export const controls = {
|
|||||||
renderTrigger: true,
|
renderTrigger: true,
|
||||||
},
|
},
|
||||||
|
|
||||||
|
target_color_picker: {
|
||||||
|
label: t('Target Color'),
|
||||||
|
description: t('Color of the target location'),
|
||||||
|
type: 'ColorPickerControl',
|
||||||
|
default: colorPrimary,
|
||||||
|
renderTrigger: true,
|
||||||
|
},
|
||||||
|
|
||||||
legend_position: {
|
legend_position: {
|
||||||
label: t('Legend Position'),
|
label: t('Legend Position'),
|
||||||
description: t('Choose the position of the legend'),
|
description: t('Choose the position of the legend'),
|
||||||
@ -723,6 +731,7 @@ export const controls = {
|
|||||||
label: t('Stroke Width'),
|
label: t('Stroke Width'),
|
||||||
validators: [v.integer],
|
validators: [v.integer],
|
||||||
default: null,
|
default: null,
|
||||||
|
renderTrigger: true,
|
||||||
choices: formatSelectOptions([1, 2, 3, 4, 5]),
|
choices: formatSelectOptions([1, 2, 3, 4, 5]),
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -759,9 +759,9 @@ export const visTypes = {
|
|||||||
{
|
{
|
||||||
label: t('Arc'),
|
label: t('Arc'),
|
||||||
controlSetRows: [
|
controlSetRows: [
|
||||||
['color_picker', 'legend_position'],
|
['color_picker', 'target_color_picker'],
|
||||||
['dimension', 'color_scheme'],
|
['dimension', 'color_scheme'],
|
||||||
['stroke_width', null],
|
['stroke_width', 'legend_position'],
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@ -69,16 +69,13 @@ export default class CategoricalDeckGLContainer extends React.PureComponent {
|
|||||||
}
|
}
|
||||||
addColor(data, fd) {
|
addColor(data, fd) {
|
||||||
const c = fd.color_picker || { r: 0, g: 0, b: 0, a: 1 };
|
const c = fd.color_picker || { r: 0, g: 0, b: 0, a: 1 };
|
||||||
const fixedColor = [c.r, c.g, c.b, 255 * c.a];
|
|
||||||
|
|
||||||
return data.map((d) => {
|
return data.map((d) => {
|
||||||
let color;
|
let color;
|
||||||
if (fd.dimension) {
|
if (fd.dimension) {
|
||||||
color = hexToRGB(getColorFromScheme(d.cat_color, fd.color_scheme), c.a * 255);
|
color = hexToRGB(getColorFromScheme(d.cat_color, fd.color_scheme), c.a * 255);
|
||||||
} else {
|
return { ...d, color };
|
||||||
color = fixedColor;
|
|
||||||
}
|
}
|
||||||
return { ...d, color };
|
return d;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
getLayers(values) {
|
getLayers(values) {
|
||||||
|
@ -19,9 +19,13 @@ function getPoints(data) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function getLayer(fd, data, slice) {
|
function getLayer(fd, data, slice) {
|
||||||
|
const sc = fd.color_picker;
|
||||||
|
const tc = fd.target_color_picker;
|
||||||
return new ArcLayer({
|
return new ArcLayer({
|
||||||
id: `path-layer-${fd.slice_id}`,
|
id: `path-layer-${fd.slice_id}`,
|
||||||
data,
|
data,
|
||||||
|
getSourceColor: d => d.sourceColor || d.color || [sc.r, sc.g, sc.b, 255 * sc.a],
|
||||||
|
getTargetColor: d => d.targetColor || d.color || [tc.r, tc.g, tc.b, 255 * tc.a],
|
||||||
strokeWidth: (fd.stroke_width) ? fd.stroke_width : 3,
|
strokeWidth: (fd.stroke_width) ? fd.stroke_width : 3,
|
||||||
...common.commonLayerProps(fd, slice),
|
...common.commonLayerProps(fd, slice),
|
||||||
});
|
});
|
||||||
|
@ -33,8 +33,6 @@ function wordCloud(element, props) {
|
|||||||
colorScheme,
|
colorScheme,
|
||||||
} = props;
|
} = props;
|
||||||
|
|
||||||
console.log('data', data);
|
|
||||||
|
|
||||||
const chart = d3.select(element);
|
const chart = d3.select(element);
|
||||||
const size = [width, height];
|
const size = [width, height];
|
||||||
const rotationFn = ROTATION[rotation] || ROTATION.random;
|
const rotationFn = ROTATION[rotation] || ROTATION.random;
|
||||||
|
Loading…
Reference in New Issue
Block a user