当前位置: 首页 > 软件库 > 程序开发 > 地图相关 >

Mapv

地图可视化工具库
授权协议 MIT
开发语言 JavaScript
所属分类 程序开发、 地图相关
软件类型 开源软件
地区 国产
投 递 者 农诚
操作系统 跨平台
开源组织 百度
适用人群 未知
 软件概览

Mapv 是一款基于百度地图的大数据可视化开源库,可以用来展示大量的点、线、面的数据,每种数据也有不同的展示类型,如直接打点、热力图、网格、聚合等方式展示数据。

浏览器支持

Mapv使用canvas开发,支持现在被称为“现代”浏览器, 通常兼容除了IE8及IE以下版本的其他大部分浏览器。

使用

<script src="dist/mapv.js" charset="utf-8"></script>

开发调试

安装相关的node插件

npm install

执行grunt监听src代码变化

grunt

示例

访问更多示例地址

point_simplepoint_bubblepoint_heatmappolygon_intensitypolyline_simplepolyline_simple_animation

示例代码

创建mapv对象

// 第一步创建mapv示例var mapv = new Mapv({
    map: map  // 百度地图的map实例});

创建点数据图层

// 创建一个图层var layer = new Mapv.Layer({
    zIndex: 3, // 图层的层级
    mapv: mapv, // 对应的mapv
    dataType: 'point', // 数据类型,point:点数据类型,polyline:线数据类型,polygon:面数据类型
    //数据,格式如下
    data: [
        {
            lng: 116.46507, // 经度
            lat: 39.929101, // 纬度
            count: 1 // 当前点的权重值
        },
        {
            lng: 116.43507,
            lat: 39.909101,
            count: 2
        }
    ],
    drawType: 'simple', // 渲染数据方式, simple:普通的打点, [更多查看类参考](https://github.com/huiyan-fe/mapv/wiki/%E7%B1%BB%E5%8F%82%E8%80%83)
    // 渲染数据参数
    drawOptions: {
        fillStyle: "rgba(255, 255, 50, 1)",  // 填充颜色
        strokeStyle: "rgba(50, 50, 255, 0.8)", // 描边颜色,不传就不描边
        lineWidth: 5, // 描边宽度
        radius: 5, // 半径大小
        unit: 'px' // 半径对应的单位,px:默认值,屏幕像素单位,m:米,对应地图上的大约距离,18级别时候1像素大约代表1米
    }
});

创建线数据图层

var layer = new Mapv.Layer({
    mapv: mapv,
    dataType: 'polyline',
    data: [
        {
            geo: [
                [116.39507, 39.879101],
                [116.49507, 39.889101],
                [116.46507, 39.929101],
                [116.43507, 39.909101]
            ],
            count: 10
        }
    ],
    drawType: 'simple',
    zIndex: 5,
    animation: true,
    drawOptions: {
        lineWidth: 2,
        strokeStyle: "rgba(0, 0, 255, 1)"
    },
    animationOptions: {
        radius: 10
    }
});

创建面数据图层

var layer = new Mapv.Layer({
    zIndex: 3,
    mapv: mapv,
    dataType: 'polygon',
    data: [
        {
            geo: [
                [116.39507, 39.879101],
                [116.49507, 39.889101],
                [116.46507, 39.929101],
                [116.43507, 39.909101]
            ],
            count: 10
        }
    ],
    drawType: 'simple',
    drawOptions: {
        lineWidth: 8,
        strokeStyle: "rgba(255, 255, 0, 1)",
        fillStyle: "rgba(255, 0, 0, 0.8)"
    }
});

谁在使用

百度慧眼

百度交通云

资源

  • mapv简介 Mapv 是一款基于百度地图的大数据可视化开源库,可以用来展示大量的点、线、面的数据,每种数据也有不同的展示类型,如直接打点、热力图、网格、聚合等方式展示数据。 浏览器支持 Mapv使用canvas开发,支持现在被称为“现代”浏览器, 通常兼容除了IE8及IE以下版本的其他大部分浏览器。 划重点:大量点 api实例地址 官网 API Reference 需求实例1-大量的多边形Pol

  • mapv没有api文档,在GitHub上只有比较简略的介绍,在如下总结的api中有一些是我在查看源码的时候发现的方法 图层隐藏 myLayer.hide() 图层显示 myLayer.show() 修改配置项 参数的格式是object.options={/要修改的配置项/} myLayer.update({ options:{} }); 重置配置项 如果在原有的配置项上有追加的配置项,或者

  • 1.api 2.官方示例 3.在leaflet中使用 引入: 方法一:<script src="http://mapv.baidu.com/build/mapv.js"></script> 方法二:cnpm install mapv 导入mapv的依赖 import { tiandituTileLayer } from '@/libs/wmtslayer/L.TiandituTileLayer'

  • <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <tit

  • 1. 引用 <script src='https://npmcdn.com/@turf/turf/turf.min.js'></script> <script src='https://api.tiles.mapbox.com/mapbox-gl-js/v2.9.1/mapbox-gl.js'></script> <link href='https://api.tiles.mapbox.com/m

  • 文档:https://github.com/huiyan-fe/mapv/blob/master/src/map/baidu-map/Layer.md <template> <div id="map" :style="{height:height}" /> </template> <script src="http://mapv.baidu.com/build/mapv.min.js"></

 相关资料
  • 我正在编写一个程序,它基本上处理一个子图DAG,即图是一个有向无环图,图的每个节点都是一个子图。例如,对于DAG中的边,节点是三角形的子图,节点是四个团的子图。边表示通过增加一个子图顶点和三个子图边从三角形扩展到四个团。 出于多种目的,我想将这个子图DAG可视化,即可视化可以同时显示DAG的整个结构和所有节点的子图。另外,如果它也能显示顶点和边的性质,那就更好了。 对于DAG边缘,节点位于节点之上

  • 有一些工具可以帮助您在几分钟内可视化所有数据。这些工具已经存在多年并且已经很成熟; 只需按照您的要求选择正确的数据可视化工具即可。 数据可视化用于与数据交互。Google,Apple,Facebook和Twitter都更好地询问他们的数据更好的问题,并通过使用数据可视化做出更好的业务决策。 以下常见的十大数据可视化工具: 1. Tableau Tableau是一种数据可视化工具。可以创建图形,图表

  • Redis是一个超精简的基于内存的键值对数据库(key-value),一般对并发有一定要求的应用都用其储存session,乃至整个数据库。不过它公自带一个最小化的命令行式的数据库管理工具,有时侯使用起来并不方便。不过Github上面已经有了很多图形化的管理工具,而且都针对REDIS做了一些优化,如自动折叠带schema的key等。 Redis Desktop Manager 一款基于Qt5的跨平台

  • 从4.0版开始,Visual C++支持一种新型的工具条资源,这使得工具条的创建比以往更加方便灵活了。在MFC中,工具条的功能由类CToolBar实现。工具条资源和工具条类CToolBar是工具条的两个要素。创建工具条的基本步骤是: 1.创建工具条资源。 2.构建一个CToolBar对象。 3.调用CToolBar::Create函数创建工具条窗口。 4.调用CToolBar::LoadToolB

  • 大数据面临数据规模大、数据变化快、数据类型多、价值密度低4个挑战,而传统的数据可视化工具难以应对。传统的数据可视化工具仅仅将数据加以组合,通过不同的展现方式提供给用户,用于发现数据之间的关联信息。近年来,随着云和大数据时代的来临,数据可视化产品已经不再满足于使用传统的数据可视化工具来对数据仓库中的数据抽取、归纳并简单的展现。新型的数据可视化产品必须满足互联网爆发的大数据需求,必须快速的收集、筛选、

  • 本节将介绍一些对于VR开发很有帮助的工具: A-Frame查看器(Inspector) - 这是一个所见即所得的检查工具以获得场景的不同视图并看到实体调整后的视觉效果,和浏览器的DOM检查器类似。可以在任意的A-Frame场景中用<ctrl> + <alt> + i组合键打开。 运动捕捉(Motion Capture) - 这是一个记录和回放头戴设备和控制器的姿势和事件的工具。点击记录,在VR头戴

  • 要创建可视化视图: 点击左侧导航栏的 Visualize 。 点击 Create new visualization 按钮或 + 按钮。 选择视图类型: 基础图形 Line, Area and Bar charts 在X/Y图中比较两个不同的序列。 Heat maps 使用矩阵的渐变单元格. Pie chart 显示每个来源的占比。 数据 Data table 显示一个组合聚合的原始数据。 Met

  • 视图工具栏位于主窗口右侧,模型库的左上方。下图所示分别为外部场景编辑界面、建筑编辑界面和楼层/室内编辑界面的视图工具栏。关于编辑界面的说明,参阅自定义建筑工具栏。 视图工具栏中,主要功能包括 2D/3D 视图转换、聚焦、行走,还设有显示/隐藏室外功能和楼层展开/折叠功能。 注意事项 行走功能在建筑编辑界面中不可用。只能用于场景或楼层/室内编辑界面。 行走模式 选择行走后,将红色胶囊置于场景或楼层中