Skip to content

Commit

Permalink
fix: 自定义图形颜色和主题切换 (#1989)
Browse files Browse the repository at this point in the history
* docs: fix custom plot demo

* docs: fix custom plot demo
  • Loading branch information
lessmost authored Nov 21, 2020
1 parent 66d8341 commit a328e7b
Show file tree
Hide file tree
Showing 2 changed files with 10 additions and 7 deletions.
15 changes: 9 additions & 6 deletions examples/plugin/basic/demo/hill-column.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
import { isObject, deepMix } from '@antv/util';
import { P, G2 } from '@antv/g2plot';

// 自定义图形
G2.registerShape('interval', 'hill', {
draw(info, container) {
const { points, style } = info;
const { points, style, defaultStyle = {} } = info;

let path = [
['M', points[0].x, points[0].y],
Expand All @@ -17,6 +18,7 @@ G2.registerShape('interval', 'hill', {
return container.addShape('path', {
attrs: {
path,
...defaultStyle,
...style,
},
});
Expand All @@ -31,7 +33,7 @@ const defaultOptions = {
// 2. adaptor 实现
function adaptor(params) {
const { chart, options } = params;
const { data, xField, yField, columnWidthRatio, columnStyle, seriesField } = options;
const { data, xField, yField, columnWidthRatio, columnStyle, theme } = options;

// 数据
chart.data(data);
Expand All @@ -46,9 +48,11 @@ function adaptor(params) {
});

// 设置重叠比率
chart.theme({
columnWidthRatio: columnWidthRatio,
});
chart.theme(
deepMix({}, isObject(theme) ? theme : G2.getTheme(theme), {
columnWidthRatio: columnWidthRatio,
})
);

const gap = (1 / data.length / 2) * columnWidthRatio; // 左右预留
chart.scale({
Expand Down Expand Up @@ -86,7 +90,6 @@ const hill = new P(
yField: 'sold',
columnStyle: {
fillOpacity: 0.3,
fill: 'red',
},
},
adaptor,
Expand Down
2 changes: 1 addition & 1 deletion examples/plugin/basic/demo/meta.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
"zh": "自定义柱图",
"en": "Custom hill column"
},
"screenshot": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*QcBKQYfdoKUAAAAAAAAAAAAAARQnAQ"
"screenshot": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*zBrDQJhu1BwAAAAAAAAAAAAAARQnAQ"
}
]
}

0 comments on commit a328e7b

Please sign in to comment.