Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

在scrat中使用echars #36

Open
fouber opened this issue Aug 19, 2015 · 0 comments
Open

在scrat中使用echars #36

fouber opened this issue Aug 19, 2015 · 0 comments

Comments

@fouber
Copy link
Member

fouber commented Aug 19, 2015

有两种办法：

  1. 使用 echarts-all.js ，丢到 views 目录下，views目录存放的都是非模块化资源，等同于传统开发，然后在HTML页面上以全局的方式script src加载echarts即可：

    <!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Scrat Template Project</title>
</head>
<body>
  <div id="main" style="height:400px;"></div>
  <script src="lib/echarts-all.js"></script>
  <script src="lib/scrat.js"></script>
  <script>
    require.config(__FRAMEWORK_CONFIG__);
    require.async('boot', function (boot) {
      var chart = echarts.init(document.getElementById('main'));
      var option = { ... };
      chart.setOption(option);
    });
  </script>
</body>
</html>

  2. 可以把echarts.js放到components目录下，作为一个模块化资源，但是由于echarts使用的是amd规范，没有使用module.exports导出模块，所以在scrat中如果不修改源码，只能利用其在全局释放的echarts变量引用资源。其步骤为：

    1. 在components目录下创建echarts目录；

    2. 移动 echarts-all.js 为 components/echarts/echarts.js 然后要使用echarts时：

      // 在其他模块化js中
require('echarts'); //仅执行factory，echarts会被挂到window上，但是没有导出
var chart = echarts.init(document.getElementById('main'));
var option = { ... };
chart.setOption(option);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@fouber