美文网首页
AntV G2 踩坑日记

AntV G2 踩坑日记

作者: dongdog | 来源:发表于2020-07-25 15:43 被阅读0次

1 直接下载源码 放入 g2.min.js 文件

image.png

2 js引入

<script  src="/statics/admin/js/g2.min.js"  language="JavaScript" ></script>

3 copy 示例到代码

报错

浏览器控制台

Uncaught (in promise) ReferenceError: Chart is not defined
    at onlineCount.html:154
//提示引入错误
 const chart = new Chart({
                    container: 'container',
                    autoFit: true,
                    height: 500,
                    padding: [30, 20, 70, 30]
                });

修改后
 const chart = new G2.Chart({
                    container: 'container',
                    autoFit: true,
                    height: 500,
                    padding: [30, 20, 70, 30]
                });

//继续报错
g2.min.js:13117 Uncaught (in promise) TypeError: Cannot read property 'appendChild' of null
    at new e (g2.min.js:13117)
    at onlineCount.html:154
// container 对应id找不到
<!-- 创建图表容器 -->
    <div id="c1"></div>

  const chart = new G2.Chart({
                    container: 'c1',
                    autoFit: true,
                    height: 500,
                    padding: [30, 20, 70, 30]
                });

显示成功

image.png

大神笔记

https://blog.csdn.net/Gozs_cs_dn/article/details/89022184

相关文章

网友评论

      本文标题:AntV G2 踩坑日记

      本文链接:https://www.haomeiwen.com/subject/gewjlktx.html