echart 地图

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%

    String path = request.getContextPath();

    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

<html>

<head>

    <meta charset="UTF-8">

    <script src="js/echarts.min.js"></script>

    <script src="js/china.js"></script>

    <script src="js/jquery-1.10.2.min.js"></script>

</head>

<body>

<h2>Hello World!</h2>

<!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->

<div id="main" style="width: 1600px;height:1400px;"></div>

<script type="text/javascript">

    var myChart = echarts.init(document.getElementById('main'));

    function setTimeDraw(execTiemes)

    {

        $.ajax({

            type: "POST",

            url: "/chinaMapdata",

            data:{type:},

            dataType: "json",

            success: function(mapdata){

                console.log(mapdata)

             var option1 = myChart.getOption()

                option1.series[].data=mapdata

                myChart.setOption(option1)

            },

            error:function (err) {

              console.log(err)

            }

        });

        if(execTiemes>)

        {

            console.log(execTiemes);

            execTiemes--;

            setTime = setTimeout('setTimeDraw('+ execTiemes +')', );

        }

        else

        {

            clearTimeout(setTime);

        }

    }

    function randomValue() {

        return Math.round(Math.random()*);

    }

    var option = {

        tooltip: {},

        visualMap: {

            min: ,

            max: ,

            left: 'left',

            top: 'bottom',

            text: ['High','Low'],

            seriesIndex: [],

            inRange: {

                color: ['#e0ffff', '#006edd']

            },

            calculable : true

        },

        geo: {

            map: 'china',

            roam: true,

            label: {

                normal: {

                    show: true,

                    textStyle: {

                        color: 'rgba(0,0,0,0.4)'

                    }

                }

            },

            itemStyle: {

                normal:{

                    borderColor: 'rgba(0, 0, 0, 0.2)'

                },

                emphasis:{

                    areaColor: null,

                    shadowOffsetX: ,

                    shadowOffsetY: ,

                    shadowBlur: ,

                    borderWidth: ,

                    shadowColor: 'rgba(0, 0, 0, 0.5)'

                }

            }

        },

        series : [

            {

                type: 'scatter',

                coordinateSystem: 'geo',

                symbolSize: ,

                symbol: 'path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z',

                symbolRotate: ,

                label: {

                    normal: {

                        formatter: '{b}',

                        position: 'right',

                        show: false

                    },

                    emphasis: {

                        show: true

                    }

                },

                itemStyle: {

                    normal: {

                        color: '#F06C00'

                    }

                }

            },

            {

                name: 'IP访问量',

                type: 'map',

                geoIndex: ,

                // tooltip: {show: false},

                data:[

                    {name: '北京', value: },

                    {name: '天津', value: },

                    {name: '上海', value: randomValue()},

                    {name: '重庆', value: randomValue()},

                    {name: '河北', value: randomValue()},

                    {name: '河南', value: randomValue()},

                    {name: '云南', value: randomValue()},

                    {name: '辽宁', value: randomValue()},

                    {name: '黑龙江', value: randomValue()},

                    {name: '湖南', value: randomValue()},

                    {name: '安徽', value: randomValue()},

                    {name: '山东', value: randomValue()},

                    {name: '新疆', value: randomValue()},

                    {name: '江苏', value: randomValue()},

                    {name: '浙江', value: randomValue()},

                    {name: '江西', value: randomValue()},

                    {name: '湖北', value: randomValue()},

                    {name: '广西', value: randomValue()},

                    {name: '甘肃', value: randomValue()},

                    {name: '山西', value: randomValue()},

                    {name: '内蒙古', value: randomValue()},

                    {name: '陕西', value: randomValue()},

                    {name: '吉林', value: randomValue()},

                    {name: '福建', value: randomValue()},

                    {name: '贵州', value: randomValue()},

                    {name: '广东', value: randomValue()},

                    {name: '青海', value: randomValue()},

                    {name: '西藏', value: randomValue()},

                    {name: '四川', value: randomValue()},

                    {name: '宁夏', value: randomValue()},

                    {name: '海南', value: randomValue()},

                    {name: '台湾', value: randomValue()},

                    {name: '香港', value: randomValue()},

                    {name: '澳门', value: randomValue()}

                ]

            }

        ]

    };

    myChart.setOption(option);

    $(function () {

        //查询5次

        setTimeDraw();

    })

</script>

</body>

</html>

echart 地图的更多相关文章

Echart - 地图散点图(服务网点图)的实现
Echart是百度开发的一个javascript图表库,可以流程运行于pc和移动端,底层依赖轻量级的 Canvas 类库 ZRender. ECharts 提供了常规的折线图,柱状图,散点图,饼图,K ...
echart地图下钻
需求:展示中国地图,鼠标点击显示对应的省份在echart的github上下载需要的地图文件China.js,各个省份的json文件遇到的问题:直接在浏览器打开报错,跨域问题,用webstrom打 ...
Echart地图城市用json返回格式
用Echarts中,使用地图的series部分中展示城市如果用json返回数据的话,js不能直接用字符串使用.需要处理一下. php中的部分 json返回的数据 js中获取json信息用ajax实现 ...
百度Echart 地图
使用百度地图做一个全国地图数据分析的功能,如下图代码 <%@ Page Language="C#" AutoEventWireup="true" Cod ...
Echart 地图实例
1.地图实例 function func_InEchart() { require.config({ paths: { echarts: '../Scripts/echart2/echarts' }, ...
echarts 点击方法总结，点任意一点获取点击数据，在多图联动中用生成标线举例
关于点击(包括左击,双击,右击等)echarts图形任意一点,获取相关的图形数据,尤其是多图,我想部分人遇到这个问题一直很头大.下面我用举例说明,如何在多图联动基础上,我们点击点击任意一个图上任意一点 ...
Echarts 南海诸岛简图显示位置调整
最近需要echart同时显示海南岛和南海诸岛,开始想寻找南海诸岛的数据,经过查找,这种简图数据是没有的(china.js地图数据一一找过了),下图是echarts的一些示例,没有满足我们的要求 ...
echarts 点击方法总结，点任意一点获取点击数据，举例说明:在多图联动中点击绘制标线
关于点击(包括左击,双击,右击等)echarts图形任意一点,获取相关的图形数据,尤其是多图,我想部分人遇到这个问题一直很头大.下面我用举例说明,如何在多图联动基础上,我们点击任意一个图上任意一点,在 ...
canvas实现平面迁徙图
前言最近在做自己维护的一个可视化工具的时候,在添加基于echart的雷达图的时候,按照echart官网案例写完发现在自己项目中无法正常运行,排查了一番发现是我项目中echart的版本太低.找到问题原 ...

随机推荐

在python中使用静态方法staticmethod
静态方法: 静态方法是类中的函数,不需要实例.静态方法主要是用来存放逻辑性的代码,主要是一些逻辑属于类,但是和类本身没有交互,即在静态方法中,不会涉及到类中的方法和属性的操作.可以理解为将静态方法存在 ...
Ueditor编辑旧文章，从数据库中取出要修改的内容
Ueditor编辑旧文章,从数据库中取出要修改的内容然后放置到编辑器中: <script type="text/plain" id="editor"> ...
HDFS配额管理指南
原文地址:http://hadoop.apache.org/docs/r1.0.4/cn/hdfs_quota_admin_guide.html Hadoop分布式文件系统(HDFS)允许管理员为每个 ...
go学习 --- Chan （通道）
Golang使用Groutine和channels实现了CSP(Communicating Sequential Processes)模型,channles在goroutine的通信和同步中承担着重要 ...
print to console or file
/*----------------------------------------------------------------------*/ /* Debug for ...
为训练深度OCR 图像，生成文本图像
https://github.com/Sanster/text_renderer Generate text images for training deep learning ocr model 在 ...
NewsLetter001
http://www.learn-english-today.com/ Project management - Iron out problems. – resolve issues. Critic ...
php - 时间操作
ini_set('date.timezone','Asia/Shanghai'); http://www.w3school.com.cn/php/func_date_strtotime.asp str ...
MySQL查看SQL语句执行效率(转)
Explain命令在解决数据库性能上是第一推荐使用命令,大部分的性能问题可以通过此命令来简单的解决,Explain可以用来查看 SQL 语句的执行效果,可以帮助选择更好的索引和优化查询语句,写出更好 ...
HDU 4670 Cube number on a tree ( 树的点分治 )
题意 : 给你一棵树 . 树的每一个结点都有一个权值 . 问你有多少条路径权值的乘积是一个全然立方数 . 题目中给了你 K 个素数 ( K <= 30 ) , 全部权值都能分解成这k个素数思路 ...

echart 地图

echart 地图的更多相关文章

随机推荐

热门专题