Skip to content
| Marketplace
Sign in
Visual Studio Code>Programming Languages>Chart.jsNew to Visual Studio Code? Get it now.
Chart.js

Chart.js

XuangeAha

|
28,582 installs
| (2) | Free
Simple and flexible JavaScript charting library for the modern web. Add Chart.js graph code to your html files easily with one click.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Chart.js

Version Installs Downloads Rating Short Rating Star

TrendingDaily TrendingWeekly TrendingMonthly

Simple and flexible JavaScript charting library for the modern web. Add Chart.js graph code to your HTML files easily with one click.

为设计和开发人员准备的简单、灵活的 JavaScript 图表工具。轻松一点即可向你的HTML文件添加Chart.js图表。

Homepage/主页: https://xuangeaha.github.io/

Repository/仓库: https://github.com/Xuangeaha/Chart.js

Issues/问题: https://github.com/Xuangeaha/Chart.js/issues

Changelog/更新日志: https://marketplace.visualstudio.com/items/XuangeAha.Chartjs/changelog

License/许可证: https://marketplace.visualstudio.com/items/XuangeAha.Chartjs/license

Download/下载: https://marketplace.visualstudio.com/items?itemName=XuangeAha.Chartjs

Copyright (c) 2023 XuangeAha(轩哥啊哈OvO)

How To Use 使用方法

  1. Right click to show context menu. 右键显示上下文菜单。
  2. Select Import Chart.js to import Chart.js script. 选择 Import Chart.js 以导入Chart.js代码。
  3. Select Insert Chart.js Graph to insert Chart.js graph. 选择 Insert Chart.js Graph 以插入Chart.js图表。

Language Supports 语言支持

Import Chart.js

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>

Insert Chart.js

<canvas id="{myChart}" width="{}" height="{}"></canvas>
<script>
    var ctx = document.getElementById('{myChart}').getContext('2d');
    var chart = new Chart(ctx, {
        type: '{line}',

        data: {
            labels: {},
            datasets: [{
                label: "{My Chart}",
                data: {},
                backgroundColor: {},
                borderColor: {},
                borderWidth: {}
            }]
        },

        options: {
            title: {
                text: "{My Chart}",
                display: {true},
            },
            events: [{}],
            legend: {
                display: {true},
            },
            tooltips: {
                mode: '{}'
            },
            layout: {{}},
            animation: {{}}
        }
    });
</script>

About Chart.js 关于 Chart.js

Chart.js is a simple and flexible JavaScript charting library for the modern web.

Chart.js 是一个为设计和开发人员准备的简单、灵活的 JavaScript 图表工具。

Official Website/官网: https://www.chartjs.org/

Chinese Official Website/中文官网: https://www.chartjs.com.cn/

Repository/仓库: https://github.com/chartjs/Chart.js

Chart.js

Enjoy!

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft