1. <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <meta name="description" content="jquery地图插件">
    <meta name="keywords" content="jquery,jquery插件,jsmap,jsmap地图">
    <title>jsMap</title>
    <style>
    *{margin:0;padding:0;outline:0}
    html{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,"PingFang SC","Microsoft YaHei",Arial,sans-serif;-webkit-text-size-adjust:100%}
    body{background:#f5f5f5}
    main{display:block}
    ul{list-style:none}
    a{text-decoration:none;color:#2285ee}
    #container{position:relative;overflow:hidden;margin:0 auto;width:1010px;height:auto;background:#fff;box-shadow:#d6d6d6 0 0 15px}
    </style>
    </head>
    <body>
    <div id="container">
    <h1>jsMap 地图插件</h1>
    <div id="map"></div>
    </div>
    </body>
    <script src="/js/map/jquery-1.9.0.min.js"></script>
    <script src="/js/map/jsMap-2.0.0.min.js"></script>
    <script>
    $(function () {
    jsMap.json( "/js/map/map.json" ).done(function ( response ) {
    //jsMap.config( "#demo-01", response ); 基础区块
  2.  
  3. jsMap.config( "#map", response, {
    //定义区块的颜色和宽度
    /*stroke: {
    width: 2,
    color: "#000"
    }*/
  4.  
  5. //disabled: [ "heilongjiang", "jilin", "liaoning" ], 禁用区域
  6.  
  7. //定义区块的填充色 悬浮色 点击色
    /*fill: {
    basicColor: "#259200",
    hoverColor: "#57cb00",
    clickColor: "#2e6f18"
    },*/
  8.  
  9. //显示区域文字和点击时的文字颜色
    /*areaName: {
    show: true,
    clickColor: "#fff"
    }*/
  10.  
  11. //自定义悬浮提示框
    /*tip: function ( id, name ) {
    return '<div style="background:#fff;padding:20px;"><p>id: ' + id + '</p><p>name: ' + name + '</p></div>';
    },*/
  12.  
  13. //自定义指定区域的填充色 / 悬浮色 / 点击色
    fill: {
    basicColor: {
    heilongjiang: "#ff5900",
    jilin: "#19bb00",
    liaoning: "#6800ff",
    jiangxi:"#8a3434"
    },
    hoverColor: {
    heilongjiang: "#ff8c4e",
    jilin: "#1fe000",
    liaoning: "#954dff"
    },
    clickColor: {
    heilongjiang: "#c94600",
    jilin: "#159a00",
    liaoning: "#5200c9"
    },
    },
    //悬浮回调函数
    /*hoverCallback: function ( id, name ) {
    console.log( id + " --- " + name );
    alert( "666 --- 999");
    }*/
  14.  
  15. // multiple: true 点击选择多个区域
    });
  16.  
  17. })
    })
    </script>
    </html>
  18.  
  19. //在线实例 http://jsmap.applinzi.com/

jsMap地图网点的更多相关文章

  1. 乐卡上海网点地图制作心得 | 百度地图API使用心得

    前言 事情的起因是我的爱人喜欢收集一些美丽的乐卡(明信片的一种,正面是美丽壮阔的风景照).作为一个坚实的后盾自然要支持她!于是我经常借着午休穿梭在大街小巷,凭借乐卡官方提供的乐卡网点地址进行寻找并取卡 ...

  2. 使用Excel VBA编程将网点的百度坐标转换后标注到高德地图上

    公司网点表存储的坐标是百度坐标,现需要将网点位置标注到高德地图上,研究了一下高德地图的云图数据模版 http://lbs.amap.com/yuntu/reference/cloudstorage和坐 ...

  3. 基于jquery地图特效全国网点查看代码

    基于jquery地图特效全国网点查看代码.这是一款简单实用的jQuery地图特效,主要知识点是jquery和css实现了中图地图,提示层效果.效果图如下: 在线预览   源码下载 实现的代码. htm ...

  4. Angularjs+node+Mysql实现地图上的多点标注

    注:本文适合对于node有一定基础的人,如果您是小白,请先用1个小时学习node.node文档https://nodejs.org/en/docs/ 该片博文的源码地址:https://github. ...

  5. Echart - 地图散点图(服务网点图)的实现

    Echart是百度开发的一个javascript图表库,可以流程运行于pc和移动端,底层依赖轻量级的 Canvas 类库 ZRender. ECharts 提供了常规的折线图,柱状图,散点图,饼图,K ...

  6. 查找附近网点geohash算法及实现 (Java版本号)

    參考文档: http://blog.csdn.net/wangxiafghj/article/details/9014363geohash  算法原理及实现方式 http://blog.charlee ...

  7. 百度地图API相关点

    百度API接口:http://developer.baidu.com/map/jsdemo.htm#a1_1 百度地图API具体解释之地图标注:http://www.cnblogs.com/jz110 ...

  8. jquery中国地图插件

    插件下载地址: http://www.17sucai.com/preview/1266961/2018-09-18/map/js/jsMap-1.1.0.min.js jsMap 项目介绍 这是一个功 ...

  9. 前端切图:调用百度地图API

    原型图 图片发自简书App <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

随机推荐

  1. Gym 100548F Color (数论容斥原理+组合数)

    题意:给定 m 种颜色,把 n 盆花排成一直线的花涂色.要求相邻花的颜色不相同,且使用的颜色恰好是k种.问一共有几种涂色方法. 析:首先是先从 m 种颜色中选出 k 种颜色,然后下面用的容斥原理,当时 ...

  2. P4148 简单题(KDTree)

    传送门 KDTree 修改权值当做插入节点,不平衡就暴力重构,询问的时候判断当前节点代表的矩形是否在询问的矩形的,是的话返回答案,相离返回0,否则的话判断当前点是否在矩形内,然后继续递归下去 //mi ...

  3. 洛谷P2384 最短路(dijkstra解法)

    题目背景 狗哥做烂了最短路,突然机智的考了Bosh一道,没想到把Bosh考住了...你能帮Bosh解决吗? 他会给你100000000000000000000000000000000000%10金币w ...

  4. 在Linux下使用linuxdeployqt发布Qt程序

    一.简介 linuxdeployqt 是Linux下的qt打包工具,可以将应用程序使用的资源(如库,图形和插件)复制到二进制运行文件所在的文件夹中. 二.安装linuxdeployqt 去github ...

  5. [UOJ386]鸽子固定器

    题解 堆+贪心 题意就是给你\(n\)个物品,让你最多选\(m\)个 每个物品有两个属性\(a_i,b_i\) 最大化\((\sum_{a_i})^{dv}+(max(b_i)-min(b_i))^{ ...

  6. magento 自建插件通道服务

    首先建立如下的目录结构 在channel.xml中如此写上 <channel> <name>local</name> <uri>http://local ...

  7. Styles and Themens(1)详述

    Styles and Themes IN THIS DOCUMENT Defining Styles Inheritance Style Properties Applying Styles and ...

  8. 转: ORA-06508 could not find program unit being called: "DBSNMP.BSLN_INTERNAL

    告警日志中出现错误 Sun Jul 28 00:00:00 2013Errors in file /oracle/app/db/diag/rdbms/mis/MIS1/trace/MIS1_j001_ ...

  9. 203 Remove Linked List Elements 删除链表中的元素

    删除链表中等于给定值 val 的所有元素.示例给定: 1 --> 2 --> 6 --> 3 --> 4 --> 5 --> 6, val = 6返回: 1 --& ...

  10. Web常见几种攻击与预防方式

    DoS和DDoS攻击 DoS(Denial of Service),即拒绝服务,造成远程服务器拒绝服务的行为被称为DoS攻击.其目的是使计算机或网络无法提供正常的服务.最常见的DoS攻击有计算机网络带 ...