使用地图表格,除了需echarts,还需zrender,自行下载JS文件:
 
目标,做成这样的效果:http://echarts.baidu.com/doc/example/map3.html
 
2015-4-3更新: 熟悉的配置页面 http://tushuo.baidu.com/
 

ECharts下载地址: http://echarts.baidu.com/

ZRender下载地址:http://ecomfe.github.io/zrender/index.html

下载完成后,
echarts:复制dist,与source文件夹;
dist:压缩后的JS,在正式环境用;
source:没压缩,测试调试用;

 
zrender: 复制src里面所有文件出来;
最后出来,三个文件夹:dist,source,Zrender(内容就是zrender-2.0.7的src所有文件)
例子Map.aspx,这里只关注路径文件,具体的图形配置,参考:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Map例子</title>
<script src="js/ECharts/dist/echarts.js"></script>
<script>
require.config({
paths: {
//echarts内容的文件夹路径
echarts: 'js/ECharts/dist',
//zrender内容的文件夹路径
zrender: "js/ECharts/Zrender"
}
});
//入口文件
require(
[
'echarts',
'echarts/chart/map'
],
function (ec) {
//额外所需的文件,在入口文件,加载完之后,回调函数中请求; //各种图,所需的配置;可从example中copy过来
//例如:
var ecConfig = require('echarts/config');
var zrEvent = require('zrender/tool/event');
//id与div对应;
var myChart = ec.init(document.getElementById('main'));
var option = {};
// 为echarts对象加载数据
myChart.setOption(option);
}
);
</script>
</head>
<body>
<div id="main" style="height: 500px"></div>
</body>

例子下载:点击

百度 Echarts 地图表 js 引用路径的更多相关文章

  1. react native使用百度echarts显示图表

    echarts是百度推出的免费开源的图表组件,功能丰富,涵盖各行业图表.公司项目做h5项目用了不少,最近公司翻新h5页面,用react-native改造,来达到增强用户体验效果的目的.项目中遇到了一些 ...

  2. C# ASP JS引用路径不正确导致的错误

    假设JS包放在根目录下的Scripts文件夹下 当前页的路径在另一个文件夹下,那么他引用JS应该:<script src="../Scripts/jquery-1.4.1.min.js ...

  3. 网页图表类框架(插件)——百度eCharts和Highcharts

    ECharts, 缩写来自Enterprise Charts,商业级数据图表,一个纯Javascript的图表库, 可以流畅的运行在PC和移动设备上,兼容当前绝大部分浏览器(IE6/7/8/9 /10 ...

  4. Vue.js中的图片引用路径问题

    当我们在Vue.js项目中引用图片时,关于图片路径有以下几种情形: 使用一: 在data里面定义好图片路径: /*错误写法*/ imgUrl:'../assets/logo.png' 在templat ...

  5. 百度echarts可以做什么

    百度echarts可以做什么 一.总结 一句话总结:可视化做的很好,各种图都有.而且支持动态数据. 二.百度eCharts体验 前言 从昨天开始给项目里添加一些图表对比功能,上一个项目里使用的是Hig ...

  6. knockout+echarts实现图表展示

    一.需要学习的知识 knockout, require, director, echarts, jquery.简单的入一下门,网上的资料很多,最直接就是进官网校习. 二.效果展示 三.require的 ...

  7. ECharts开源图表使用方法简单介绍

    ECharts图表是基于Canvas,纯Javascript图表库,基于BSD开源协议,官网地址:http://echarts.baidu.com/index.html 需要先下载插件:https:/ ...

  8. ECharts数据图表系统? 5分钟上手!

    目录: 前言 简介 方法一:模块化单文件引入(推荐) 方法二:标签式单文件引入 [前言] 最近在捣鼓各种插件各种框架,发现这个ECharts还是比较不错的,文档也挺全的,还是中文的,给大家推荐一下. ...

  9. 完整版ajax+百度echarts实现统计图表demo并随着窗口大小改变而自适应

    1.前言 百度Echarts会常用到我们的项目中做统计,api很详细,demo也非常之多,我们常用的是应有尽有了,做一些小项目的时候,百度echarts的demo已足够用了.今天呢.主要是跟小白讲一下 ...

随机推荐

  1. ORACLE中死锁

    ORACLE中死锁的知识点总结   死锁的概念 什么是死锁呢? 其实我们生活中也有很多类似死锁的例子. 我先举一个生活中的例子:过年回家,父亲买了一把水弹枪,儿子和侄子争抢着要先玩,谁也不让谁,拆开包 ...

  2. 基于Linux应用层的6LOWPAN物联网网关及实现方法

    本发明涉及一种基于Linux应用层的6LOWPAN物联网网关及实现方法,所述物联网网关包括开发平台以及无线射频模块,其实现方法是:所述6LOWPAN物联网网关的以太网网口收到访问6LOWPAN无线传感 ...

  3. 【26.67%】【codeforces 596C】Wilbur and Points

    time limit per test2 seconds memory limit per test256 megabytes inputstandard input outputstandard o ...

  4. htmlunit 模拟登录 无验证码

    1.模拟登录csdn,最开始的时候使用的是httpclient,网上的所有模拟登录csdn的版本都是找到lt/execution/event_id.连同用户名及密码 一起发送即可,但是目前的csdn的 ...

  5. Visual Studio 2017 and Apache Cordova mobile apps | Andrés Zsögön

    原文:Visual Studio 2017 and Apache Cordova mobile apps | Andrés Zsögön 以下是使用Microsoft Visual Studio 20 ...

  6. win10下安装docker步骤(一)

    一.启用Hyper-V 打开控制面板 - 程序和功能 - 启用或关闭Windows功能,勾选Hyper-V,然后点击确定即可,如图: 请注意电脑默认的Hyper-V虚拟机监控程序是不能进行勾选的,需要 ...

  7. 前端构建工具里babel-polyfill的使用问题

    看了很多react工程的package.json文件,里面都没有使用babel-polyfill,那对ES6的新API是如何做到被IE9这样的浏览器识别的呢,难道在webpack打包的时候通过别的方式 ...

  8. 【37.50%】【codeforces 732D】Exams

    time limit per test1 second memory limit per test256 megabytes inputstandard input outputstandard ou ...

  9. WPF 高速书写 StylusPlugIn 原理

    原文:WPF 高速书写 StylusPlugIn 原理 本文告诉大家 WPF 的 StylusPlugIn 为什么能做高性能书写,在我的上一篇博客和大家介绍了 WPF 的触摸原理,但是没有详细告诉大家 ...

  10. jquery.uploadify上传图片,点击保存按钮无法使用解决方法

    用Chrome浏览器上传商品图片时,保存按钮无法点击,如下图 原因:Flash插件状态为禁止 或 询问(默认) 解决方法:将Flash插件状态改为允许,如下图