React PieChart - Relocate the Legend

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

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

Below, you can try out these properties in action.

See Also