echarts3.0 引用json地图

作者:用户 来源:互联网 浏览:10892 次 时间:2016-05-10 17:30:55

echartsjson地图

echarts3.0 引用json地图 - 摘要: echarts3.0引用json地图echarts3.0有两个引入地图的方式,http://echarts.baidu.com/download-map.html我用js的方法引入成功了,但是用jso

问题描述

echarts3.0 引用json地图

echarts3.0有两个引入地图的方式,
html" rel="nofollow">http://echarts.baidu.com/download-map.html
我用js的方法引入成功了,但是用json的方法就是看不到地图(火狐也看不到),空白一片

以下是我的目录结构
F:MyEcharts3.0
-china.js
-china.json
-echarts.js
-echarts.min.js
-jquery.min.js
-macarons2.js
-MyTest.html

china.json是echarts官网下载的

以下是我的html代码
<!DOCTYPE html>




<!--自适应device-width设备宽度-->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script src="./echarts.js"></script>
<script src="./jquery.min.js"></script>
<title>ECharts</title>

<style> 

</style> 

$.get('./china.json', function (chinaJson) { echarts.registerMap('china', chinaJson); var chart = echarts.init(document.getElmentById('main')); chart.setOption({ series: [{ type: 'map', map: 'china' }] }); }); //myChart.setOption(option);

本人是新手,因为工作需要才开始接触echarts,html,希望大神耐心指导,谢谢
顺便弱弱的问一下echarts3.0怎么像之前一样,加载主题文件?

解决方案

<!DOCTYPE html>
<head>
        <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--自适应device-width设备宽度-->
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1">


    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <script src="./echarts.js"></script>
    <script src="./jquery.min.js"></script>
        <title>ECharts</title>

    <style> 

    </style> 
</head>

<body>

<div  id="main" style="height:800px;width:100%;border:1px solid black;"></div>


<script>
$.get('./china.json', function (chinaJson) {
        echarts.registerMap('china', chinaJson);
        var chart = echarts.init(document.getElmentById('main'));
        chart.setOption({
                series: [{
                        type: 'map',
                        map: 'china'
                }]
        });
});
//myChart.setOption(option);

</script>

</body>
【云栖快讯】你想见的Java技术专家都在这了,向大佬提问,有问题必答  详情请点击
云栖社区(yq.aliyun.com)为您免费提供echarts3.0 引用json地图相关信息,包括 echarts json地图 的信息 ,所有echarts3.0 引用json地图相关内容均不代表云栖社区的意见! 该页面h5页面的地址是:https://m.aliyun.com/yunqi/wenzhang/show_18242,您可以点击echarts3.0 引用json地图-手机站访问。
弹性可伸缩的计算服务,助您降低 IT 成本,提升运维效率

40+云计算产品,6个月免费体验

现在注册,免费体验40+云产品,及域名优惠!

云服务器9.9元/月,大学必备

热点导航