使用Chart.js+JavaScript开发candlestick蜡烛图提示无此图表类型如何解决

报错原因 #

原生Chart.js未内置蜡烛图（candlestick）类型，该能力需要额外加载官方扩展插件chartjs-chart-financial才能使用，你的代码存在2个具体问题：

• 你使用<link>标签加载JS文件/static/profile/js/financial.js，link是用于加载样式资源的标签，加载JS必须使用<script>标签
• 你引入的financial.js如果不是正确的chartjs-chart-financial扩展文件，或者引入顺序错误，都会导致Chart.js识别不到candlestick类型

修复方案 #

1. 调整资源引入顺序和标签，优先使用稳定CDN避免本地文件问题，正确的资源引入顺序为：

<script src="https://cdnjs.cloudflare.com/ajax/libs/luxon/2.0.2/luxon.min.js" integrity="sha512-frUCURIeB0OKMPgmDEwT3rC4NH2a4gn06N3Iw6T1z0WfrQZd7gNfJFbHrNsZP38PVXOp6nUiFtBqVvmCj+ARhw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-luxon@1.0.0"></script>
<!-- 替换原来的link标签，正确引入金融图表扩展 -->
<script src="https://cdn.jsdelivr.net/npm/chartjs-chart-financial"></script>

2. 你现有的JS逻辑和数据结构不需要修改，插件加载完成后即可正常渲染蜡烛图

内容的提问来源于stack exchange，提问作者Ashti Nematian