-
Notifications
You must be signed in to change notification settings - Fork 184
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: enable chart grid enable option #761
Changes from 2 commits
c00d4f5
426d2a9
ff71f3a
9672840
4de05e1
965513b
a5ea445
774f6a4
ec9212a
4d97cdf
068846f
d6a4177
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change | ||||||
---|---|---|---|---|---|---|---|---|
|
@@ -12,6 +12,14 @@ export class Grid extends Component { | |||||||
backdrop: any; | ||||||||
|
||||||||
render(animate = true) { | ||||||||
const gridEnable = Tools.getProperty( | ||||||||
this.model.getOptions(), | ||||||||
"grid", | ||||||||
"enabled" | ||||||||
); | ||||||||
if (!gridEnable) { | ||||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Suggested change
|
||||||||
return; | ||||||||
} | ||||||||
// Draw the backdrop | ||||||||
this.drawBackdrop(); | ||||||||
DOMUtils.appendOrSelect(this.backdrop, "g.x.grid"); | ||||||||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -61,6 +61,8 @@ const legend: LegendOptions = { | |
* Grid options | ||
*/ | ||
export const grid: GridOptions = { | ||
// set enable to false will not draw grid and stroke of grid backdrop | ||
enabled: false, | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. grid cannot be disabled by default |
||
x: { | ||
numberOfTicks: 15 | ||
}, | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -10,6 +10,16 @@ | |
stroke: $ui-03; | ||
} | ||
|
||
rect.chart-grid-backdrop-no-stroke { | ||
@if $carbon--theme == $carbon--theme--g10 { | ||
fill: $ui-01; | ||
} @else if $carbon--theme == $carbon--theme--g90 { | ||
fill: $carbon--gray-100; | ||
} @else { | ||
fill: $ui-background; | ||
} | ||
} | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. why do we need this extra classname? There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. The reason why we need |
||
|
||
g.x.grid g.tick, | ||
g.y.grid g.tick { | ||
line { | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.