DevExtreme React - Relocate the Legend

The legend can be aligned in the horizontal or vertical direction using the horizontalAlignment or verticalAlignment option.

App.js
  • import React from 'react';
  • import Funnel, { Legend } from 'devextreme-react/funnel';
  •  
  • class App extends React.Component {
  • render() {
  • return (
  • <Funnel ... >
  • <Legend
  • horizontalAlignment="center" {/* or "left" | "right" */}
  • verticalAlignment="top" {/* or "bottom" */}
  • />
  • </Funnel>
  • );
  • }
  • }
  •  
  • export default App;

Below, you can try out these options in action.

See Also