### Plugin Initialization Example

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-plugin.md

Example of how to instantiate and load the ChartsViewPlugin. This is typically done during the plugin's startup sequence.

```typescript
const plugin = new ChartsViewPlugin(app, manifest);
await plugin.onload();
// Plugin is now active, commands are registered
```

--------------------------------

### Install Project Dependencies

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/README.md

Install all necessary Node.js dependencies for the project. This command should be run before building or developing the plugin.

```bash
npm install
```

--------------------------------

### Chart Component Example

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-chart-component.md

Example of how to use the Chart component with sample data and configuration. Ensure 'type' and 'config' are correctly provided.

```typescript
import { Chart } from './components/Chart';

const chartProps = {
  type: 'Bar',
  config: {
    data: [
      { action: 'Browse', pv: 50000 },
      { action: 'Add to cart', pv: 35000 }
    ],
    xField: 'pv',
    yField: 'action'
  },
  showExportBtn: true
};

<Chart
  type={chartProps.type}
  config={chartProps.config}
  showExportBtn={chartProps.showExportBtn}
/>
```

--------------------------------

### Settings Usage

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/types.md

Provides an example of the `ChartsViewPluginSettings` object, outlining available configuration options for the plugin.

```APIDOC
## Settings Usage

### Description
Example of the plugin settings object.

### Usage

```typescript
const settings: ChartsViewPluginSettings = {
  dataPath: 'data/charts',
  theme: 'dark',
  backgroundColor: '#f5f5f5',
  paddingTop: 20,
  paddingRight: 20,
  paddingBottom: 20,
  paddingLeft: 20,
  wordCountFilter: 'the\nand\nor',
  showExportBtn: true
};
```
```

--------------------------------

### Chart Data Examples

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-chart-component.md

Illustrates different formats for chart data. Examples include an array of objects, a single object, and a generic 'any' type.

```plaintext
[{x: 1, y: 2}, {x: 2, y: 4}]
{name: 'data', value: 100}
Any other value
```

--------------------------------

### Inline Data Example

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/configuration.md

Illustrates how to provide data directly within the YAML configuration as an array of objects.

```yaml
# Inline data
data:
  - name: Item
    value: 100
```

--------------------------------

### Example Options Usage

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/types.md

Illustrates how to structure chart rendering options, including field mappings and nested configurations for labels and legends.

```typescript
const options: Options = {
  xField: "month",
  yField: "value",
  colorField: "category",
  label: {
    position: "middle",
    style: { opacity: 0.6 }
  },
  legend: {
    layout: "horizontal"
  }
}
```

--------------------------------

### Example Preferences for Bar Chart

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/types.md

Shows an example of `Preferences` configuration for a bar chart, including swapped keys for horizontal orientation and default field settings for labels, values, and series.

```typescript
const barPrefs: Preferences = {
  labelsFieldKey: 'yField',      // Swapped for horizontal bar
  valuesFieldKey: 'xField',      // Swapped for horizontal bar
  seriesFieldKey: 'seriesField',
  labels: { field: 'category', value: [...] },
  values: [{ field: 'value', value: [...] }],
  series: { field: 'group' }
}
```

--------------------------------

### Dataviewjs Example (Column) Chart Template

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/README.md

Template for inserting a chart using Dataviewjs for data. Use the command 'Charts View: Insert Template' -> 'Dataviewjs Example (Column)'.

```chartsview
type: Column
```

--------------------------------

### Update Theme Setting Example

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-settings.md

Demonstrates how to update the 'Theme' setting and persist the changes using `plugin.saveSettings()`.

```typescript
new Setting(containerEl)
  .setName("Theme")
  .addDropdown(dropdown => dropdown
    .addOption("default", "default")
    .setValue(this.plugin.settings.theme)
    .onChange(async (value) => {
      this.plugin.settings.theme = value;
      await this.plugin.saveSettings();
    })
  );
```

--------------------------------

### User Flow Example for Inserting Template

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-modal.md

Illustrates the step-by-step process a user follows to insert a template using the 'Insert Template' command, including modal interaction, search, selection, and final YAML customization.

```markdown
User input: "Charts View: Insert Template" command
           ↓
Template modal opens (FuzzySuggestModal)
           ↓
User types "bar" in search
           ↓
Modal filters to "Bar" template with thumbnail
           ↓
User clicks "Bar"
           ↓
Code block inserted at cursor:
  ```chartsview
  type: Bar
  data: [...] 
  options: [...] 
  ```
           ↓
User edits YAML to customize
```

--------------------------------

### Run Plugin in Development Mode

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/README.md

Start the development server for continuous rebuilding. This command watches for file changes and automatically rebuilds the plugin.

```bash
npm run dev
```

--------------------------------

### Data Source Examples

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/README.md

Examples of how to specify different data sources for charts within YAML code blocks. Supports inline data, CSV files, word count data, and Dataview queries.

```yaml
data: [{x: 1, y: 2}]
```

```yaml
data: data.csv
```

```yaml
data: "wordcount:filename"
```

```yaml
data: "dataviewjs: return dv.pages().length"
```

--------------------------------

### Chart Wizard User Interaction Example

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-wizard.md

Demonstrates the step-by-step user interaction within the Chart Wizard, from opening the command to confirming selections, and shows the resulting YAML output for a Bar chart.

```yaml
type: Bar
data:
  - month: "Jan"
    sales: "100"
  - month: "Feb"
    sales: "200"
  - month: "Mar"
    sales: "150"
options:
  yField: "month"
  xField: "sales"
```

--------------------------------

### Example Bar Chart Template

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-modal.md

This is an example of a decoded Bar chart template in YAML format. It shows the basic structure with type, data, and options.

```yaml
type: Bar

data:
  - action: "Browse the website"
    pv: 50000
  - action: "Add to cart"
    pv: 35000

options:
  xField: "pv"
  yField: "action"
```

--------------------------------

### Example Field Configuration for Bar Chart

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-wizard.md

Illustrates a typical configuration for a simple bar chart with one value field, specifying field names and values for labels and data.

```text
Chart Type: Bar
Value Number: 1
Values[0] Field: "value"
Values[0] Values: "38 52 61 145 48"
Series Field: "" (empty)
Label Field: "label"
Label Values: "1951 1952 1956 1957 1958"
```

--------------------------------

### Markdown Code Block Processor Example

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-plugin.md

Example of a markdown code block that will be processed by the ChartsViewPlugin. The 'chartsview' type indicates it should be rendered as a chart.

```markdown
```chartsview
type: Bar
data:
  - action: Browse
    pv: 50000
options:
  xField: pv
  yField: action
```
```

--------------------------------

### Registering a Custom Theme

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-chart-component.md

Demonstrates how to register a custom theme with the chart component using the `registerTheme` function. This example shows registering 'theme2'.

```javascript
registerTheme('theme2', compactTheme({...}))
```

--------------------------------

### Get Folder Options for Dropdown

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-tools.md

Scans the Obsidian vault to generate a record of all folder paths, suitable for populating dropdown menus in settings. Requires an `App` instance.

```typescript
export function getFolderOptions(app: App): Record<string, string>
```

```typescript
import { getFolderOptions } from './tools';

const options = getFolderOptions(app);
// { 'docs': 'docs', 'charts': 'charts', 'data/csv': 'data/csv', ... }
```

```typescript
new Setting(containerEl)
  .setName("Data Folder")
  .addDropdown(dropdown => dropdown
    .addOptions(getFolderOptions(this.app))
    // ...
  );
```

--------------------------------

### ChartTemplateSuggestModal onChooseItem Method Example

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-modal.md

Handles the selection of a template from the modal. It decodes the base64-encoded template content and inserts it into the editor.

```typescript
const base64Content = item[1]; // "YGBgY2hhcnRzdmlldwp..."
const decoded = Buffer.from(base64Content, "base64").toString("utf8");
// Now: "```chartsview\ntype: Bar\n..."
insertEditor(editor, decoded);
```

--------------------------------

### Example Usage of DataType in Wizard

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/types.md

Illustrates how to use the `DataType` type to define labels for a chart, specifying the field name and an array of string values.

```typescript
const labels: DataType = {
  field: 'month',
  value: ['January', 'February', 'March']
}
```

--------------------------------

### Decoding Chart Template YAML

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/types.md

Example of how to decode the base64 encoded YAML string for a chart template.

```typescript
const base64 = ChartTemplateType.Bar;
const yaml = Buffer.from(base64, "base64").toString("utf8");
```

--------------------------------

### Add New Data Source

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/README.md

Extend the `loadFromFile` function in `parser.ts` to support custom data sources. This example shows how to add a new source prefixed with 'mysource:'.

```typescript
if (data.startsWith("mysource:")) {
  return loadFromMySource(data.substring(9), plugin);
}
```

--------------------------------

### ChartWizardModal Class

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-wizard.md

The ChartWizardModal class provides an interactive, step-by-step interface for users to create charts without manual YAML configuration. It guides users through selecting chart types, configuring data fields, and previewing the chart in real-time.

```APIDOC
## Class: ChartWizardModal

### Description
Modal dialog that guides users through creating a chart interactively. Users select chart type, configure data fields, and preview the chart in real-time.

### Constructor
```typescript
constructor(
  app: App,
  private editor: Editor,
  private settings: ChartsViewPluginSettings
)
```

#### Parameters
- **app** (App) - Required - Obsidian App instance
- **editor** (Editor) - Required - Current editor for inserting final chart code
- **settings** (ChartsViewPluginSettings) - Required - Plugin settings (for theme, padding, etc.)

### Methods
#### `onOpen`
```typescript
onOpen(): void
```

Called when the modal is opened. Initializes UI and renders content.

**Initialization Details:**
- Sets modal width to 860px.
- Creates title "Chart Wizard".
- Initializes `chartSetting` with default chart type (Area).
- Loads default data configuration.
- Sets value number to 1.
- Displays content and confirm button.

#### `displayContent`
```typescript
private displayContent(): void
```

Resets and renders the modal content. Called during initialization and when settings change.

#### `createSetting`
```typescript
private createSetting(): void
```

Creates form fields in the modal for chart configuration, including chart type, value number, value fields, series field (optional), and label field.

#### `renderChart`
```typescript
private renderChart(): void
```

Renders a live preview of the chart with the current configuration. Builds data, constructs options, and mounts the React Chart component.
```

--------------------------------

### Custom Word Filter Regex Patterns

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/configuration.md

Provides examples of custom regex patterns for the word filter, demonstrating single letters, specific words, words containing substrings, and alternatives.

```regex
^a$           # Single letter 'a'
^the$         # Word 'the'
common        # Any word containing 'common'
^(is|are)$    # Words 'is' or 'are'
\d{4}         # Four-digit numbers
```

--------------------------------

### loadSettings Method

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-plugin.md

Asynchronously loads the plugin's settings from Obsidian's data storage.

```APIDOC
## Method: loadSettings

### Signature
```typescript
async loadSettings(): Promise<void>
```

### Description
Loads plugin settings from Obsidian's data storage.

Merges DEFAULT_SETTINGS with saved data using `Object.assign()`.
```

--------------------------------

### Build Plugin

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/README.md

Build the plugin for production. This command generates the main JavaScript file, manifest, and CSS styles.

```bash
npm run build
```

--------------------------------

### Get Current Theme

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-settings.md

Retrieves the current theme object based on the plugin's settings. Ensure the theme name is valid.

```typescript
const theme = getTheme(plugin.settings.theme);
```

--------------------------------

### Settings Module

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/INDEX.txt

Documentation for plugin settings, including the interface, setting tab, and configuration options.

```APIDOC
## Module: settings (settings.tsx)

### Interface & Class

- **ChartsViewPluginSettings interface**
  - Description: Defines the structure for plugin settings.

- **ChartsViewSettingTab class**
  - Description: Implements the UI for the plugin's settings tab.

### Configuration Options

- **Theme**: Supports default, dark, theme1, theme2.
- **Background Color**
- **Chart Padding**: Configurable for top, right, bottom, and left.
- **Data Folder**
- **Show Export Button**
- **Word Filter**
  - Description: Various configuration options for customizing chart appearance and behavior.
```

--------------------------------

### Building Options

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/types.md

Illustrates how to define options for chart configurations, specifying fields for axes, color, labels, and legends.

```APIDOC
## Building Options

### Description
Patterns for defining chart configuration options.

### Usage

```typescript
const options: Options = {
  xField: 'month',
  yField: 'value',
  colorField: 'category',
  label: { position: 'top' },
  legend: { position: 'bottom' }
};
```
```

--------------------------------

### Add Custom Interaction

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/README.md

Extend the `ObsidianAction` class in `Chart.tsx` to implement custom interactions. This example shows the basic structure for a `customAction` method.

```typescript
public customAction(arg: Record<string, string>) {
  // Implementation
}
```

--------------------------------

### ChartsViewSettingTab Constructor

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-settings.md

Initializes the setting tab with the Obsidian app instance and a reference to the plugin.

```typescript
constructor(app: App, private plugin: ChartsViewPlugin)
```

--------------------------------

### Importing and Using Plugin Types

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/types.md

Demonstrates how to import core types like ChartProps, ConfigProps, DataType, ChartTemplateType, and ChartsViewPluginSettings from the plugin's module path. This is useful for defining configurations and props for charts within your consumer code.

```typescript
import {
  ChartProps,
  ConfigProps,
  DataType,
  ChartTemplateType,
  ChartsViewPluginSettings
} from './your-module-path';

const config: ConfigProps = { /* ... */ };
const props: ChartProps = {
  type: 'Bar',
  config
};
```

--------------------------------

### Folder Selection UI

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-tools.md

Creates a dropdown UI for selecting a folder using `getFolderOptions` from './tools'. The selected folder path is available in the `onChange` callback.

```typescript
import { getFolderOptions } from './tools';

const folderMap = getFolderOptions(app);
new Setting(containerEl)
  .setName("Select Folder")
  .addDropdown(d => d
    .addOptions(folderMap)
    .onChange(async (value) => {
      // User selected folder path in 'value'
    })
  );
```

--------------------------------

### Project Module Organization

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/README.md

The plugin's source code is organized into logical modules for maintainability. Key files include main lifecycle management, configuration parsing, settings UI, utility functions, chart templates, and type definitions, with a dedicated components directory for UI elements.

```treeview
src/
├── main.tsx                 # Plugin lifecycle and markdown processing
├── parser.ts               # Configuration parsing and data loading
├── settings.tsx            # Settings UI and configuration
├── tools.ts                # Utility functions
├── templates.ts            # Chart templates and thumbnails
├── types.d.ts              # TypeScript type augmentation
└── components/
    ├── Chart.tsx           # Chart component and interactions
    ├── Modal.ts            # Template selection modal
    └── ChartWizardModal.tsx # Chart creation wizard
```

--------------------------------

### getFolderOptions

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-tools.md

Scans the Obsidian vault to retrieve all available folders and returns them as options suitable for a dropdown menu.

```APIDOC
## getFolderOptions

### Description
Scans the vault and returns all folders as options for dropdown menu.

### Method
```typescript
getFolderOptions(app: App): Record<string, string>
```

### Parameters
#### Path Parameters
- **app** (App) - Required - Obsidian App instance

### Return Type:
`Record<string, string>`

Object where both keys and values are folder paths.

### Example:
```typescript
import { getFolderOptions } from './tools';

const options = getFolderOptions(app);
// { 'docs': 'docs', 'charts': 'charts', 'data/csv': 'data/csv', ... }
```

### Usage:
Used in settings dropdown for selecting data folder:
```typescript
new Setting(containerEl)
  .setName("Data Folder")
  .addDropdown(dropdown => dropdown
    .addOptions(getFolderOptions(this.app))
    // ...
  );
```
```

--------------------------------

### Get Word Count Regex

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-tools.md

Constructs a comprehensive regex pattern for matching words across multiple languages and character sets. Called internally by getWordCount() to tokenize text before filtering.

```typescript
function getWordCountRegex(): RegExp
```

--------------------------------

### ChartTemplateSuggestModal Constructor

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-modal.md

Initializes the ChartTemplateSuggestModal with the Obsidian App instance and the current editor.

```typescript
constructor(app: App, private editor: Editor)
```

--------------------------------

### saveSettings Method

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-plugin.md

Asynchronously saves the current plugin settings to Obsidian's data storage.

```APIDOC
## Method: saveSettings

### Signature
```typescript
async saveSettings(): Promise<void>
```

### Description
Saves current plugin settings to Obsidian's data storage.

Called automatically after user changes any setting.
```

--------------------------------

### ChartWizardModal Constructor

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-wizard.md

Initializes the ChartWizardModal with necessary Obsidian API instances and plugin settings.

```typescript
constructor(
  app: App,
  private editor: Editor,
  private settings: ChartsViewPluginSettings
)
```

--------------------------------

### Apply Default Theme

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/TECHNICAL_REFERENCE.md

Uses the plugin's default theme, which is determined by the 'plugin.settings.theme' configuration.

```yaml
# Use plugin's default theme
type: Bar
data: [...]
```

--------------------------------

### Chart Creation Wizard Command

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-plugin.md

Registers a command to open the Chart Wizard Modal for step-by-step chart configuration. This command requires the plugin's settings.

```typescript
editorCallback: async (editor: Editor) => {
  new ChartWizardModal(this.app, editor, this.settings).open();
}
```

--------------------------------

### Configure Multi-View Charts (Mix)

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/configuration.md

Use the 'Mix' type to combine multiple chart views. Define data sources and options for each view using keys like `data.viewName` and `options.viewName`.

```yaml
type: Mix

data.area: [...]
data.line: "data.csv"

options.area:
  xField: time
  yField: temperature

options.line:
  xField: time
  yField: humidity
```

--------------------------------

### Configuration Size Constants

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-wizard.md

Constants defining input sizes and the default chart type for the configuration interface.

```typescript
const VALUE_INPUT_SIZE = 80;      // Character width for value inputs
const NAME_INPUT_SIZE = 14;       // Character width for name inputs
const DEFAULT_CHART_TYPE = 'Area'; // Default chart type
```

--------------------------------

### loadFromFile

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-parser.md

Routes data loading based on the specified source type, supporting inline data, word count, Dataview queries, and CSV files.

```APIDOC
## loadFromFile

### Description
Routes data loading based on source type: inline data, word count, dataview query, or CSV file.

### Method
async function

### Parameters
#### Path Parameters
- **data** (DataOptionType) - Required - The data source configuration.
- **plugin** (ChartsViewPlugin) - Required - The plugin instance.
- **sourcePath** (string) - Required - The path of the source file.
- **options** (Options) - Required - Chart options.

### Returns
- **Promise<DataType>** - The loaded chart data.
```

--------------------------------

### ConfigProps

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-chart-component.md

Configuration properties for rendering a chart, including data, theme, background color, and callbacks.

```APIDOC
## ConfigProps

### Description
Configuration properties for rendering a chart, including data, theme, background color, and callbacks.

### Fields
- **data** (DataType) - Optional - Chart data array or object
- **theme** (Record<string, unknown>) - Optional - Theme configuration object
- **backgroundColor** (string) - Optional - CSS background color
- **onReady** ((instance: unknown) => void) - Optional - Callback when chart renders
- **[other]** (DataType | string | number) - Optional - Ant Design plot-specific config keys
```

--------------------------------

### ConfigProps Interface

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-chart-component.md

Defines the configuration properties for chart rendering. This includes data, theme, background color, and a ready callback.

```typescript
export interface ConfigProps {
  data?: DataType;
  theme?: Record<string, unknown>;
  backgroundColor?: string;
  onReady?: (instance: unknown) => void;
  [key: string]: DataType | string | number;
}
```

--------------------------------

### ObsidianAction: fileopen Method

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-chart-component.md

Opens a note file directly from a chart data field. Requires 'vault' and 'pathField' properties in the argument.

```typescript
public fileopen(arg: Record<string, string>): void
```

--------------------------------

### Plugin Component Structure

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/TECHNICAL_REFERENCE.md

Illustrates the modular architecture of the plugin, showing the separation of concerns between the Plugin Layer, Configuration Layer, Component Layer, and Utilities.

```plaintext
Plugin Layer (main.tsx)
    ├── Settings Management (settings.tsx)
    ├── Markdown Processing (main.tsx)
    ├── Command Registration (main.tsx)
    └── Event Handling

Configuration Layer (parser.ts)
    ├── YAML Parsing
    ├── Data Loading
    │   ├── CSV Files
    │   ├── Word Count
    │   ├── Dataview Queries
    │   └── Inline Objects
    └── Options Processing

Component Layer (React)
    ├── Chart Component (Chart.tsx)
    ├── Template Modal (Modal.ts)
    ├── Wizard Modal (ChartWizardModal.tsx)
    └── Custom Interactions

Utilities (tools.ts)
    ├── CSV Parsing
    ├── Word Counting
    ├── Folder Navigation
    └── Editor Manipulation
```

--------------------------------

### Plugin Commands

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/INDEX.txt

Lists the commands available to users within Obsidian.

```APIDOC
## Plugin Commands

### Available Commands

1. **Insert Template**: Command to insert a chart template.
2. **Wizard**: Command to launch the interactive chart builder.
3. **Import data from external CSV file (desktop)**: Command for importing data from CSV files.
```

--------------------------------

### ChartsViewSettingTab display Method

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-settings.md

Renders the settings UI when the settings tab is opened, creating form fields for all configurable settings.

```typescript
display(): void
```

--------------------------------

### ChartWizardModal renderChart Method

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-wizard.md

Renders a live preview of the chart based on the current configuration. It constructs data, builds chart options, and mounts the React Chart component.

```typescript
private renderChart(): void
```

--------------------------------

### ChartTemplateSuggestModal renderSuggestion Method

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-modal.md

Renders a suggestion item in the modal, including a thumbnail image and text. It creates a container, extracts the template type, fetches the thumbnail, and adds it to the element.

```typescript
renderSuggestion(item: FuzzyMatch<ChartTemplateType>, el: HTMLElement): void {
    // Creates container div with class `chartsview-thumbnail`
    // Extracts template type from matched item
    // Gets thumbnail URL from `ChartThumbnailMapping`
    // Creates `<img>` element with thumbnail
    // Adds `chartsview-thumbnail-container` class to element
    // Calls parent `renderSuggestion()` to add text/highlight
}
```

--------------------------------

### onload Method

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-plugin.md

Lifecycle method called when the plugin is loaded. It handles the registration of commands, markdown processors, and initialization of plugin settings.

```APIDOC
## Method: onload

### Signature
```typescript
async onload(): Promise<void>
```

### Description
Called when the plugin is loaded. Registers commands, sets up markdown processors, and initializes settings.

**Actions performed:**
1. Loads plugin settings from storage
2. Registers settings tab for configuration UI
3. Registers `chartsview` markdown code block processor
4. Adds `Insert Template` command to editor
5. Adds `Wizard` command to editor
6. Adds `Import data from external CSV file` command (desktop only)
7. Registers `.csv` file extension

### Example
```typescript
const plugin = new ChartsViewPlugin(app, manifest);
await plugin.onload();
// Plugin is now active, commands are registered
```
```

--------------------------------

### Apply Chart Theme and Background Color

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-settings.md

Applies theme and background color settings to charts using parseConfig(). Ensures default values are used if not explicitly set.

```typescript
// From parseConfig() in parser.ts
config.theme = config.theme ?? getTheme(plugin.settings.theme);

// Apply background color
if (useDefaultBgColor) {
  config.theme.background = plugin.settings.backgroundColor;
}

// Apply padding
config.appendPadding = config.appendPadding ?? [
  plugin.settings.paddingTop,
  plugin.settings.paddingRight,
  plugin.settings.paddingBottom,
  plugin.settings.paddingLeft
];
```

--------------------------------

### Enable Simple Search Interaction

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/configuration.md

Enable interactive search on chart clicks with the default search behavior by setting `enableSearchInteraction` to `true`.

```yaml
options:
  enableSearchInteraction: true
```

--------------------------------

### Load and Save Plugin Settings

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/configuration.md

Use `loadData` and `saveData` to persist plugin settings. Ensure settings are initialized with default values.

```typescript
async loadSettings() {
  this.settings = Object.assign(DEFAULT_SETTINGS, await this.loadData());
}
```

```typescript
async saveSettings() {
  await this.saveData(this.settings);
}
```

--------------------------------

### ChartsViewSettingTab Class

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-settings.md

Extends Obsidian's PluginSettingTab to create the user interface for configuring plugin settings.

```typescript
export class ChartsViewSettingTab extends PluginSettingTab
```

--------------------------------

### Building Chart Data

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/types.md

Demonstrates various ways to structure data for charts, including inline objects, arrays of objects, and word count data.

```APIDOC
## Building Chart Data

### Description
Patterns for structuring data to be used in charts.

### Usage

```typescript
// From inline objects
const data: DataType = { x: 1, y: 2 };

// From arrays
const data: DataType = [{ x: 1, y: 2 }, { x: 3, y: 4 }];

// From word count
const data: DataType = [
  { word: 'hello', count: 5 },
  { word: 'world', count: 3 }
];
```
```

--------------------------------

### Pie Chart Template

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/README.md

Template for inserting a Pie chart. Use the command 'Charts View: Insert Template' -> 'Pie'.

```chartsview
type: Pie
```

--------------------------------

### Count Pages by Day/Night Creation Time with DataviewJS

Source: https://github.com/caronchen/obsidian-chartsview-plugin/wiki/Chart-examples

Categorizes pages into 'Day' (8 AM - 6 PM) or 'Night' based on their creation hour and counts the pages in each category. Helps understand when notes are typically created.

```dataviewjs
#-----------------#
#- chart data    -#
#-----------------#
data: |
  dataviewjs:
  return dv.pages()
           .groupBy(p => p.file.ctime.hour >= 8 && p.file.ctime.hour <= 18 ? 'Day' : 'Night')
		   .map(p => ({cdate: p.key, count: p.rows.length}))
		   .array();
```

--------------------------------

### Plugin Core Class

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/INDEX.txt

Details about the main plugin class, its lifecycle, and integration points.

```APIDOC
## Module: plugin (main.tsx)

### Class

- **ChartsViewPlugin main class**
  - Description: The primary class for the Obsidian Charts View Plugin.
  - Lifecycle:
    - `onload()`: Initialization logic when the plugin loads.
    - `onunload()`: Cleanup logic when the plugin unloads.
  - Features:
    - Command registration for plugin actions.
    - Settings integration with Obsidian's settings system.
```

--------------------------------

### Count Folders with DataviewJS

Source: https://github.com/caronchen/obsidian-chartsview-plugin/wiki/Chart-examples

Groups pages by their folder and counts the number of pages in each folder. Use this to visualize the distribution of your notes across your vault's directory structure.

```dataviewjs
#-----------------#
#- chart data    -#
#-----------------#
data: |
  dataviewjs:
  return dv.pages()
           .groupBy(p => p.file.folder)
		   .map(p => ({folder: p.key || "ROOT", count: p.rows.length}))
		   .array();
```

--------------------------------

### Custom Label Formatter Function

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/configuration.md

Demonstrates using a JavaScript function string to format labels, appending a '%' sign.

```yaml
options:
  label:
    formatter:
      function formatter(val) {
        return val + '%';
      }
```

--------------------------------

### Count Pages by Creation Hour with DataviewJS

Source: https://github.com/caronchen/obsidian-chartsview-plugin/wiki/Chart-examples

Groups pages by the hour of their creation and counts the number of pages created in each hour. Provides insight into hourly activity patterns.

```dataviewjs
#-----------------#
#- chart data    -#
#-----------------#
data: |
  dataviewjs:
  return dv.pages()
           .groupBy(p => p.file.ctime.toFormat("HH"))
		   .map(p => ({cdate: p.key, count: p.rows.length}))
		   .array();
```

--------------------------------

### Handle Plugin Loading Errors

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-plugin.md

A try-catch block to catch and log errors that occur during plugin loading.

```typescript
try {
  // Loading logic
} catch (error) {
  console.log(`Load error. ${error}`);
}
```

--------------------------------

### Package JSON Configuration

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/configuration.md

Defines the project's metadata, version, and essential dependencies for the Obsidian ChartsView plugin. Includes charting libraries, data parsers, and React compatibility.

```json
{
  "name": "obsidian-chartsview-plugin",
  "version": "1.2.8",
  "main": "main.js",
  "description": "Data visualization solution in Obsidian based on Ant Design Charts.",
  "dependencies": {
    "@ant-design/graphs": "^1.0.9",
    "@ant-design/plots": "^1.0.9",
    "@antv/g2": "^4.x",
    "js-yaml": "^4.1.0",
    "papaparse": "^5.3.1",
    "react": "npm:@preact/compat@^17.0.2",
    "react-dom": "npm:@preact/compat@^17.0.2"
  }
}
```

--------------------------------

### ObsidianAction: file Method

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-chart-component.md

Searches for notes where the clicked element appears in the filename. Wraps the search term in quotes and parentheses.

```typescript
public file(arg: Record<string, string>): void
```

--------------------------------

### Enable Custom Search Interaction

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/README.md

Configure custom search interaction by specifying the `field` for the keyword and the `operator` for the Obsidian search.

```yaml
#-----------------#
#- chart options -#
#-----------------#
options:
  ...
  enableSearchInteraction:
    field: 'word'
    operator: 'path'
```

--------------------------------

### ChartsViewPluginSettings Interface

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-settings.md

Defines the structure for all configurable settings of the Charts View plugin.

```typescript
export interface ChartsViewPluginSettings {
  dataPath: string;
  theme: string;
  backgroundColor: string;
  paddingTop: number;
  paddingRight: number;
  paddingBottom: number;
  paddingLeft: number;
  wordCountFilter: string;
  showExportBtn: boolean;
}
```

--------------------------------

### Insert Chart Template Command

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-plugin.md

Registers a command to open the Chart Template Suggest Modal. Use this to allow users to select and insert predefined chart templates into the editor.

```typescript
editorCallback: (editor: Editor) => {
  new ChartTemplateSuggestModal(this.app, editor).open();
}
```

--------------------------------

### Dataview Query Chart

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/README.md

Create charts by executing a DataviewJS query. The query should return data in a format suitable for charting, such as grouped page counts.

```yaml
type: Column
data: "dataviewjs: return dv.pages().groupBy(p => p.type).map(p => ({type: p.key, count: p.rows.length}))"
options:
  xField: type
  yField: count
```

--------------------------------

### Count Pages by Creation Month with DataviewJS

Source: https://github.com/caronchen/obsidian-chartsview-plugin/wiki/Chart-examples

Groups pages by their creation month and year, then counts the number of pages for each month. Useful for tracking content creation over time.

```dataviewjs
#-----------------#
#- chart data    -#
#-----------------#
data: |
  dataviewjs:
  return dv.pages()
           .groupBy(p => p.file.cday.toFormat("yyyy/MM"))
           .map(p => ({cdate: p.key, count: p.rows.length}))
           .array();
```

--------------------------------

### Modal Components

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/INDEX.txt

Reference for modal classes used for template suggestions and interactive chart building.

```APIDOC
## Module: Modals

### Classes

- **ChartTemplateSuggestModal class**
  - Description: Provides suggestions for chart templates. Includes enum and storage details.

- **ChartWizardModal class**
  - Description: Facilitates interactive chart configuration with real-time preview and data building.
```

--------------------------------

### Word Count Data Sources for Word Cloud

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/TECHNICAL_REFERENCE.md

Demonstrates different ways to specify data for a word cloud chart using word count analysis. Supports specific files, all files, or folder contents.

```yaml
type: WordCloud
data: "wordcount:filename"     # Specific file
data: "wordcount:/"            # All files
data: "wordcount:@folder/"     # Folder contents
```

--------------------------------

### Enable Search Interaction (Custom)

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/TECHNICAL_REFERENCE.md

Configures custom search interactions by specifying the data field, search operator, and path field.

```yaml
# Custom
options:
  enableSearchInteraction:
    field: "word"              # Data field to search for
    operator: "tag"            # Search operator
    pathField: "path"          # For fileopen (default: path)
```

--------------------------------

### ChartWizardModal Default State Initialization

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-wizard.md

Sets the initial default configuration for chart settings, data fields, and value number when the modal is opened.

```typescript
this.chartSetting = { type: 'Area', config: {} }
this.dataLabels = DEFAULT.labels  // { field: 'label', value: [...] }
this.dataValues = DEFAULT.values  // [{ field: 'value', value: [...] }]
this.dataSeries = DEFAULT.series  // { field: 'serie' }
this.valueNumber = 1
```

--------------------------------

### Mix Chart Template

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/README.md

Template for inserting a Mix chart. Use the command 'Charts View: Insert Template' -> 'Mix'. Data and options must use the same identifier.

```chartsview
type: Mix
```

--------------------------------

### Import CSV Data and Insert into Editor

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-tools.md

Parses CSV data from a selected file and inserts it as YAML into the editor. Requires `parseCsv` and `insertEditor` from './tools' and `js-yaml` for YAML dumping.

```typescript
import { parseCsv, insertEditor } from './tools';
import yaml from 'js-yaml';

const file = await fileDialog({ accept: '.csv' });
const csvText = await file.text();
const records = parseCsv(csvText);

const yamlStr = yaml.dump(records, { quotingType: '"', noRefs: true });
insertEditor(editor, yamlStr);
```

--------------------------------

### loadFromDataViewPlugin

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-parser.md

Executes JavaScript code with the Dataview API to dynamically generate chart data.

```APIDOC
## loadFromDataViewPlugin

### Description
Executes JavaScript code with Dataview API to generate chart data dynamically.

### Method
async function

### Parameters
#### Path Parameters
- **content** (string) - Required - JavaScript code (without the `dataviewjs:` prefix).
- **plugin** (ChartsViewPlugin) - Required - Plugin instance.
- **sourcePath** (string) - Required - Current file path for Dataview context.

### Returns
- **Promise<DataType>** - Chart data generated by the executed JavaScript code.
```

--------------------------------

### Bar Chart Template

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/README.md

Template for inserting a Bar chart. Use the command 'Charts View: Insert Template' -> 'Bar'.

```chartsview
type: Bar
```

--------------------------------

### Basic Chart YAML Structure

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/TECHNICAL_REFERENCE.md

Outlines the fundamental structure for defining a chart using YAML. Includes the required chart type and optional data and options fields.

```yaml
type: ChartType                 # Required: chart type name

data: DataSource               # Optional: data or data source
# OR
data.viewName: DataSource      # Multi-view data

options:                       # Optional: Ant Design options
  xField: fieldname
  yField: fieldname
  colorField: fieldname
  # ... other options
# OR
options.viewName:             # Multi-view options
  # ...

```

--------------------------------

### Generate a Tag Cloud with DataviewJS

Source: https://github.com/caronchen/obsidian-chartsview-plugin/wiki/Chart-examples

Extracts all tags from pages, groups them, and counts their occurrences to create a tag cloud. This requires the 'chartsview' type.

```chartsview
#-----------------#
#- chart type    -#
#-----------------#
type: WordCloud

#-----------------#
#- chart data    -#
#-----------------#
data: |
  dataviewjs:
  return dv.pages()
           .flatMap(p => p.file.etags)
           .groupBy(p => p)
           .map(p => ({tag: p.key, count: p.rows.length}))
           .array();

#-----------------#
#- chart options -#
#-----------------#
options:
  wordField: "tag"
  weightField: "count"
  colorField: "count"
  wordStyle:
    rotation: 30
  enableSearchInteraction:
    operator: tag
```

--------------------------------

### ObsidianAction Class Methods

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-chart-component.md

Custom G2 action class for handling click interactions on chart elements to trigger Obsidian search and navigation. These methods allow for specific search queries within Obsidian based on chart data.

```APIDOC
## ObsidianAction Class

### Methods

#### `tag(arg: Record<string, string>)`
Searches Obsidian for items tagged with the clicked element's field value. Uses search prefix `tag%3A`.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.

#### `file(arg: Record<string, string>)`
Searches for notes with the clicked element in the filename. Uses search prefix `file%3A` and quote-parenthesis wrapper: `("value")`.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.

#### `fileopen(arg: Record<string, string>)`
Opens the note file directly from a field in the chart data.

- **arg** (Record<string, string>) - Required - Must contain `vault` and `pathField` properties. The `pathField` specifies which data field contains the file path.

#### `path(arg: Record<string, string>)`
Searches Obsidian with the `path:` search operator. Uses quote-parenthesis wrapper: `("value")`.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.

#### `content(arg: Record<string, string>)`
Searches Obsidian with the `content:` search operator. Uses parenthesis wrapper: `(value)`.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.

#### `task(arg: Record<string, string>)`
Searches for tasks matching the clicked element. Uses search prefix `task%3A` with parenthesis wrapper.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.

#### `matchCase(arg: Record<string, string>)`
Searches with case-sensitive matching.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.

#### `ignoreCase(arg: Record<string, string>)`
Searches with case-insensitive matching.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.

#### `line(arg: Record<string, string>)`
Searches for content on specific lines.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.

#### `block(arg: Record<string, string>)`
Searches within code blocks.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.

#### `taskTodo(arg: Record<string, string>)`
Searches for incomplete tasks. Uses search prefix `task-todo%3A`.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.

#### `taskDone(arg: Record<string, string>)`
Searches for completed tasks. Uses search prefix `task-done%3A`.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.

#### `section(arg: Record<string, string>)`
Searches within specific document sections.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.

#### `default(arg: Record<string, string>)`
Default search behavior without operator prefix. Uses quote wrapper: `"value"`.

- **arg** (Record<string, string>) - Required - Argument object. Must contain `field` and `vault` properties.
```

--------------------------------

### Import Dataview API

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/types.md

Import the Dataview API for querying and manipulating vault metadata. This is the primary way to interact with Dataview functionality.

```typescript
import { DataviewApi } from "obsidian-dataview";
```

--------------------------------

### Word Cloud Chart

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/README.md

Generate a word cloud from a specified data source, typically text content. Configure the fields for words, their weights, and colors.

```yaml
type: WordCloud
data: "wordcount:@notes/"
options:
  wordField: word
  weightField: count
  colorField: count
```

--------------------------------

### ObsidianAction: matchCase Method

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-chart-component.md

Enables case-sensitive search matching for Obsidian queries.

```typescript
public matchCase(arg: Record<string, string>): void
```

--------------------------------

### ChartWizardModal createSetting Method

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-wizard.md

Generates the form fields within the modal for configuring chart properties such as type, values, series, and labels.

```typescript
private createSetting(): void
```

--------------------------------

### Register Custom Themes

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/TECHNICAL_REFERENCE.md

Register new themes for charts using the `registerTheme` function. Provide a unique theme name and its configuration object.

```typescript
registerTheme('mytheme', { /* theme config */ })
```

--------------------------------

### loadFromCsv

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-parser.md

Loads structured data from CSV files within the Obsidian vault.

```APIDOC
## loadFromCsv

### Description
Loads structured data from CSV files in the vault.

### Method
async function

### Parameters
#### Path Parameters
- **data** (string) - Required - Comma-separated CSV filenames.
- **plugin** (ChartsViewPlugin) - Required - Plugin instance.

### Returns
- **Promise<DataType>** - Parsed CSV data (single object if one file, array if multiple files).
```

--------------------------------

### Add Settings Tab

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-plugin.md

Registers the settings tab for the plugin, providing a UI for users to configure plugin behavior.

```typescript
this.addSettingTab(new ChartsViewSettingTab(this.app, this))
```

--------------------------------

### All Files Word Count Data

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/configuration.md

Configures the chart to use word count data from all files in the vault.

```yaml
# All files word count
data: "wordcount:/"
```

--------------------------------

### Configure a Dual Axes Chart with Column and Line

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/README.md

This configuration sets up a 'DualAxes' chart, using two CSV files for data. It specifies 'value' and 'count' as the y-fields and configures custom formatting for the 'value' axis. Geometry options define a column for one dataset and a line with specific styling for the other.

```chartsview
#-----------------#
#- chart type    -#
#-----------------#
type: DualAxes

#-----------------#
#- chart data    -#
#-----------------#
data: DualAxesData.csv, DualAxesData.csv

#-----------------#
#- chart options -#
#-----------------#
options:
  xField: 'time'
  yField: ['value', 'count']
  yAxis:
    value:
      min: 0
      label:
        formatter:
          function formatter(val) {
            return ''.concat(val, '个');
          }
  geometryOptions:
    - geometry: 'column'
    - geometry: 'line'
      lineStyle:
	    lineWidth: 2
```

--------------------------------

### ObsidianAction: path Method

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-chart-component.md

Searches Obsidian using the 'path:' operator. Wraps the search term in quotes and parentheses.

```typescript
public path(arg: Record<string, string>): void
```

--------------------------------

### DataProps Interface

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-parser.md

Represents the configuration object parsed from YAML for charts. Supports view-specific data and options for multi-view charts.

```typescript
interface DataProps {
  type: string;
  options?: Options;
  data?: DataType;
  [key: string]: DataOptionType;
}
```

--------------------------------

### ObsidianAction: default Method

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-chart-component.md

Default Obsidian search behavior without an operator prefix. Wraps the search term in quotes.

```typescript
public default(arg: Record<string, string>): void
```

--------------------------------

### Default Settings Object

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-settings.md

Provides the default configuration values for the Charts View plugin, including a comprehensive word count filter.

```typescript
export const DEFAULT_SETTINGS: ChartsViewPluginSettings = {
  theme: 'default',
  dataPath: '',
  backgroundColor: 'transparent',
  paddingTop: 0,
  paddingRight: 0,
  paddingBottom: 0,
  paddingLeft: 0,
  showExportBtn: false,
  wordCountFilter: `[A-z]{1,2}
[0-9]+
(?=[MDCLXVI])M*(C[MD]|D?C*)(X[CL]|L?X*)(I[XV]|V?I*)
and
are
but
...`
}
```

--------------------------------

### Radar Chart Template

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/README.md

Template for inserting a Radar chart. Use the command 'Charts View: Insert Template' -> 'Radar'.

```chartsview
type: Radar
```

--------------------------------

### Load Data via Dataview Plugin

Source: https://github.com/caronchen/obsidian-chartsview-plugin/blob/master/_autodocs/api-reference-parser.md

Executes JavaScript code with the Dataview API to dynamically generate chart data. The code receives a `dv` object and should return chart data.

```typescript
async function loadFromDataViewPlugin(
  content: string,
  plugin: ChartsViewPlugin,
  sourcePath: string
): Promise<DataType>
{
  // ... implementation details ...
  return dataType;
}
```