VisActor / VisActor/VChart

[Feature] Agent-oriented VChart spec authoring workflow

Open
#4,648 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
1.8k
Forks
221
Avg merge
1d 6h
Merged PRs (30d)
26

Description

What problem does this feature solve?

VChart already provides vchart-development-assistant, which is useful for developers building, modifying, or debugging VChart applications.

I think there is a related but different workflow that may be worth supporting explicitly: an autonomous/data agent producing a VChart visualization as part of its own work.

In this case, the agent is not necessarily helping a developer write a VChart application. It may have already analyzed some data and simply needs to decide how to visualize the result, author a valid VChart spec, and pass that spec to a renderer.

For example:

User

"Show these data with an appropriate VChart visualization."

Agent

  • understands the visualization goal
  • inspects the data and runtime constraints
  • chooses an appropriate chart
  • authors a VChart spec
  • validates the result

    VChart spec

    host / renderer

The VChart spec itself is the useful artifact here. It may be rendered in a browser, embedded into another application, consumed by another tool, or converted to image/HTML later.

I ran a small prototype of this workflow with Feishu Card as the host renderer.

After the host/output constraints had been provided in the earlier conversation context, the later user request was simply natural language plus data:

下面的数据
周一 12
周二 25
周三 18
周四 32

用合适的 vchart 图表展示

The agent chose a bar chart, generated the VChart payload, and the host rendered it directly as a native chart.

Image

In this prototype, Feishu is only the renderer and the transport layer passes the generated payload through unchanged. The VChart authoring itself is done by the agent.

What feels missing is a reusable way to provide that working knowledge. Currently, the prototype relies on conversation history to teach the agent the relevant VChart and renderer constraints. A VChart skill could make this knowledge explicit and reusable, instead of requiring low-level instructions to be repeated in each conversation.

The existing vchart-development-assistant is primarily developer-oriented and currently treats runnable application output such as HTML as the final result. For autonomous/data-agent workflows, I think it may also be useful to treat a reusable VChart spec as a first-class result.

This also seems consistent with vchart-mcp-server, where spec, image, and html are already separate output forms.

What does the proposed API look like?

This may not require a new VChart runtime API.

I think the useful addition is an agent-facing authoring workflow, either as a new skill or as an additional workflow in the existing vchart-development-assistant.

A possible working model is:

Target

  • What should the visualization communicate?

Context

  • What data is available?
  • What VChart/runtime/renderer constraints apply?

Result

  • Produce an appropriate, reusable VChart spec.

Test

  • Check data/field mappings and required configuration.
  • When possible, verify the spec with a real VChart renderer.

The intention is not to turn visualization into a rigid step-by-step pipeline. The agent should still be able to make decisions based on the actual data and task; the skill would provide the domain knowledge, constraints, references, and validation methods needed to do that reliably.

I am not strongly attached to whether this should be a separate skill or an extension of vchart-development-assistant. I would prefer to align on that boundary before implementing it.

If this use case fits the direction of VChart's skill ecosystem, I would be happy to work on the implementation.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reviewing the existing vchart-development-assistant workflow and vchart-mcp-server output forms, then clarify whether this belongs in a new skill or an extension. Define the agent-facing workflow around target, context, result, and test; done means it can produce a reusable VChart spec with checked data mappings and configuration, optionally verified by a real renderer.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
ai, tooling
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Active
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.