JavaScript/jQuery PolarChart - legend.title.subtitle
Configures the legend subtitle. The subtitle appears only if the title is specified.
To specify only the subtitle's text, assign it directly to this property. Otherwise, set this property to an object with the text and other fields specified.
font
Specifies the legend subtitle's font properties.
Type:
The following code sample illustrates how to set this property:
jQuery
index.js
$(function() {
$("#polarChartContainer").dxPolarChart({
// ...
legend: {
title: {
// ...
subtitle: {
// ...
font: {
color: "black"
}
}
}
}
});
});Angular
app.component.html
app.component.ts
app.module.ts
<dx-polar-chart ... >
<dxo-legend>
<dxo-title ... >
<dxo-subtitle ... >
<dxo-font
color="black">
</dxo-font>
</dxo-subtitle>
</dxo-title>
</dxo-legend>
</dx-polar-chart>
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
// ...
}
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { DxPolarChartModule } from 'devextreme-angular';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
DxPolarChartModule
],
providers: [ ],
bootstrap: [AppComponent]
})
export class AppModule { }Vue
App.vue
<template>
<DxPolarChart ... >
<DxLegend>
<DxTitle ... >
<DxSubtitle ... >
<DxFont
color="black"
/>
</DxSubtitle>
</DxTitle>
</DxLegend>
</DxPolarChart>
</template>
<script>
import DxPolarChart, {
DxLegend,
DxTitle,
DxSubtitle,
DxFont
} from 'devextreme-vue/polar-chart';
export default {
components: {
DxPolarChart,
DxLegend,
DxTitle,
DxSubtitle,
DxFont
},
// ...
}
</script>React
App.js
import React from 'react';
import PolarChart, {
Legend,
Title,
Subtitle,
Font
} from 'devextreme-react/polar-chart';
class App extends React.Component {
render() {
return (
<PolarChart ... >
<Legend ... >
<Title ... >
<Subtitle ... >
<Font color="black" />
</Subtitle>
</Title>
</Legend>
</PolarChart>
);
}
}
export default App;offset
Specifies the distance between the legend's title and subtitle in pixels.
Type:
Default Value: 0
Feedback