Skip to content

Grid

Sometimes when we embed our visual in the HTML element, if it is not well styled the chart may have some issues being displayed, like missing or over side spaces, or some values are chopped by a container div for example. One way to solve this is to apply right CSS styles or to use the Grid object to handle the margins of the visualization.

1
2
var grid = cf.Grid().left(200).top(300)
myChart.set('grid',grid)

This will make the chart look like this:

Extra left and top values shrink the visual ELT

This of course is a little bit exaggerated, but it shows the point on how the Grid object affects the visual. It also supports .right() and .bottom()