├── .babelrc.json ├── .editorconfig ├── .github └── workflows │ └── build.yml ├── .gitignore ├── LICENSE ├── README.md ├── README.zh-CN.md ├── build ├── generateExamples.js ├── header.js ├── post-build.js └── rewrite-amd.js ├── dist ├── echarts-extension-gmap.cjs.js ├── echarts-extension-gmap.esm.js ├── echarts-extension-gmap.js ├── echarts-extension-gmap.js.map ├── echarts-extension-gmap.min.js └── echarts-extension-gmap.min.js.map ├── examples ├── heatmap.html ├── heatmap_zh_CN.html ├── lines.html ├── lines_zh_CN.html ├── pie.html ├── pie_zh_CN.html ├── scatter.html └── scatter_zh_CN.html ├── export.d.ts ├── export.js ├── index.d.ts ├── index.js ├── package-lock.json ├── package.json ├── rollup.config.js ├── src ├── GMapCoordSys.js ├── GMapModel.js ├── GMapView.js ├── helper.js └── index.js └── types.d.ts /.babelrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | "@babel/env" 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | charset = utf-8 9 | trim_trailing_whitespace = true 10 | insert_final_newline = true 11 | 12 | [*.md] 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /.github/workflows/build.yml: -------------------------------------------------------------------------------- 1 | name: Build 2 | 3 | on: 4 | workflow_dispatch: 5 | push: 6 | pull_request: 7 | types: [opened, synchronize] 8 | 9 | jobs: 10 | build: 11 | runs-on: ubuntu-latest 12 | 13 | steps: 14 | - uses: actions/checkout@v4 15 | 16 | - uses: actions/setup-node@v4 17 | with: 18 | registry-url: https://registry.npmjs.org/ 19 | 20 | - name: Cache node modules 21 | id: cache 22 | uses: actions/cache@v4 23 | env: 24 | cache-name: cache-node-modules 25 | with: 26 | path: '**/node_modules' 27 | key: ${{ runner.os }}-test-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }} 28 | 29 | - name: Install dependencies 30 | if: steps.cache.outputs.cache-hit != 'true' 31 | run: npm ci 32 | 33 | - name: Build from source 34 | run: npm run build 35 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | ### Node template 2 | # Logs 3 | logs 4 | *.log 5 | npm-debug.log* 6 | yarn-debug.log* 7 | yarn-error.log* 8 | 9 | # Runtime data 10 | pids 11 | *.pid 12 | *.seed 13 | *.pid.lock 14 | 15 | # Directory for instrumented libs generated by jscoverage/JSCover 16 | lib-cov 17 | 18 | # Coverage directory used by tools like istanbul 19 | coverage 20 | 21 | # nyc test coverage 22 | .nyc_output 23 | 24 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 25 | .grunt 26 | 27 | # Bower dependency directory (https://bower.io/) 28 | bower_components 29 | 30 | # node-waf configuration 31 | .lock-wscript 32 | 33 | # Compiled binary addons (https://nodejs.org/api/addons.html) 34 | build/Release 35 | 36 | # Dependency directories 37 | node_modules/ 38 | jspm_packages/ 39 | 40 | # TypeScript v1 declaration files 41 | typings/ 42 | 43 | # Optional npm cache directory 44 | .npm 45 | 46 | # Optional eslint cache 47 | .eslintcache 48 | 49 | # Optional REPL history 50 | .node_repl_history 51 | 52 | # Output of 'npm pack' 53 | *.tgz 54 | 55 | # Yarn Integrity file 56 | .yarn-integrity 57 | 58 | # dotenv environment variables file 59 | .env 60 | 61 | # parcel-bundler cache (https://parceljs.org/) 62 | .cache 63 | 64 | # vuepress build output 65 | .vuepress/dist 66 | 67 | # Serverless directories 68 | .serverless 69 | 70 | # IDE 71 | .idea 72 | 73 | # Service worker 74 | sw.* 75 | 76 | # test 77 | test/ 78 | 79 | # tpl 80 | examples/*.tpl 81 | examples/*.version 82 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020-2024 Zhongxiang Wang 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | [![NPM version](https://img.shields.io/npm/v/echarts-extension-gmap.svg?style=flat)](https://www.npmjs.org/package/echarts-extension-gmap) 2 | [![Build Status](https://github.com/plainheart/echarts-extension-gmap/actions/workflows/build.yml/badge.svg)](https://github.com/plainheart/echarts-extension-gmap/actions/workflows/build.yml) 3 | [![NPM Downloads](https://img.shields.io/npm/dm/echarts-extension-gmap.svg)](https://npmcharts.com/compare/echarts-extension-gmap?minimal=true) 4 | [![jsDelivr Downloads](https://data.jsdelivr.com/v1/package/npm/echarts-extension-gmap/badge?style=rounded)](https://www.jsdelivr.com/package/npm/echarts-extension-gmap) 5 | [![License](https://img.shields.io/npm/l/echarts-extension-gmap.svg)](https://github.com/plainheart/echarts-extension-gmap/blob/master/LICENSE) 6 | 7 | ## Google Map extension for Apache ECharts 8 | 9 | [中文说明](https://github.com/plainheart/echarts-extension-gmap/blob/master/README.zh-CN.md) 10 | 11 | [Online example on CodePen](https://codepen.io/plainheart/pen/VweLGbR) 12 | 13 | This is a Google Map extension for [Apache ECharts](https://echarts.apache.org/en/index.html) which is used to display visualizations such as [Scatter](https://echarts.apache.org/en/option.html#series-scatter), [Lines](https://echarts.apache.org/en/option.html#series-lines), [Heatmap](https://echarts.apache.org/en/option.html#series-heatmap), and [Pie](https://echarts.apache.org/en/option.html#series-pie). 14 | 15 | ### Examples 16 | 17 | [Scatter](https://github.com/plainheart/echarts-extension-gmap/tree/master/examples/scatter.html) 18 | 19 | [Lines](https://github.com/plainheart/echarts-extension-gmap/tree/master/examples/lines.html) 20 | 21 | [Heatmap](https://github.com/plainheart/echarts-extension-gmap/tree/master/examples/heatmap.html) 22 | 23 | [Pie](https://github.com/plainheart/echarts-extension-gmap/tree/master/examples/pie.html) 24 | 25 | ![Preview](https://user-images.githubusercontent.com/26999792/202892350-5a7df14e-18ea-4f98-9a62-f55d29ad9a49.png) 26 | 27 | ### Installation 28 | 29 | ```shell 30 | npm install echarts-extension-gmap --save 31 | ``` 32 | 33 | ### Import 34 | 35 | Import packaged distribution file `echarts-extension-gmap.min.js` and add Google Map API script and ECharts script. 36 | 37 | ```html 38 | 39 | 40 | 41 | 42 | 43 | 44 | ``` 45 | 46 | You can also import this extension by `require` or `import` if you are using webpack or any other bundler. 47 | 48 | 49 | ```js 50 | // use require 51 | require('echarts'); 52 | require('echarts-extension-gmap'); 53 | 54 | // use import 55 | import * as echarts from 'echarts'; 56 | import 'echarts-extension-gmap'; 57 | ``` 58 | 59 | Or use a CDN 60 | 61 | [jsdelivr](https://www.jsdelivr.com/) 62 | 63 | ```html 64 | 65 | ``` 66 | 67 | [unpkg](https://unpkg.com/) 68 | 69 | ```html 70 | 71 | ``` 72 | 73 | This extension will register itself as a component of `echarts` after it is imported. 74 | 75 | ### Usage 76 | 77 | This extension can be configured simply like [geo](https://echarts.apache.org/en/option.html#geo). 78 | 79 | ```js 80 | option = { 81 | // load gmap component 82 | gmap: { 83 | // initial options of Google Map 84 | // See https://developers.google.com/maps/documentation/javascript/reference/map#MapOptions for details 85 | // initial map center, accepts an array like [lng, lat] or an object like { lng, lat } 86 | center: [108.39, 39.9], 87 | // center: { lng: 108.39, lat: 39.9 }, 88 | // initial map zoom 89 | zoom: 4, 90 | 91 | // whether echarts layer should be rendered when the map is moving. `true` by default. 92 | // if false, it will only be re-rendered after the map `moveend`. 93 | // It's better to set this option to false if data is large. 94 | renderOnMoving: true, 95 | // the zIndex of echarts layer for Google Map. `2000` by default. 96 | echartsLayerZIndex: 2019, 97 | // whether to enable gesture handling. `true` by default. 98 | // since v1.4.0 99 | roam: true 100 | 101 | // More initial options... 102 | }, 103 | series: [ 104 | { 105 | type: 'scatter', 106 | // use `gmap` as the coordinate system 107 | coordinateSystem: 'gmap', 108 | // data items [[lng, lat, value], [lng, lat, value], ...] 109 | data: [[120, 30, 8], [120.1, 30.2, 20]], 110 | encode: { 111 | // encode the third element of data item as the `value` dimension 112 | value: 2, 113 | lng: 0, 114 | lat: 1 115 | } 116 | } 117 | ] 118 | }; 119 | 120 | // Get the instance of Google Map 121 | var gmap = chart 122 | .getModel() 123 | .getComponent('gmap') 124 | .getGoogleMap(); 125 | // Add some markers to map 126 | var marker = new google.maps.Marker({ position: gmap.getCenter() }); 127 | marker.setMap(gmap); 128 | // Add TrafficLayer to map 129 | // var trafficLayer = new google.maps.TrafficLayer(); 130 | // trafficLayer.setMap(gmap); 131 | ``` 132 | -------------------------------------------------------------------------------- /README.zh-CN.md: -------------------------------------------------------------------------------- 1 | [![NPM version](https://img.shields.io/npm/v/echarts-extension-gmap.svg?style=flat)](https://www.npmjs.org/package/echarts-extension-gmap) 2 | [![Build Status](https://github.com/plainheart/echarts-extension-gmap/actions/workflows/build.yml/badge.svg)](https://github.com/plainheart/echarts-extension-gmap/actions/workflows/build.yml) 3 | [![NPM Downloads](https://img.shields.io/npm/dm/echarts-extension-gmap.svg)](https://npmcharts.com/compare/echarts-extension-gmap?minimal=true) 4 | [![jsDelivr Downloads](https://data.jsdelivr.com/v1/package/npm/echarts-extension-gmap/badge?style=rounded)](https://www.jsdelivr.com/package/npm/echarts-extension-gmap) 5 | [![License](https://img.shields.io/npm/l/echarts-extension-gmap.svg)](https://github.com/plainheart/echarts-extension-gmap/blob/master/LICENSE) 6 | 7 | ## Apache ECharts 谷歌地图扩展 8 | 9 | [README_EN](https://github.com/plainheart/echarts-extension-gmap/blob/master/README.md) 10 | 11 | [在线示例](https://codepen.io/plainheart/pen/VweLGbR) (示例中使用了谷歌地图API，国内访问需要代理) 12 | 13 | [Apache ECharts](https://echarts.apache.org/zh/index.html) 谷歌地图扩展，可以在谷歌地图上展现 [点图](https://echarts.apache.org/zh/option.html#series-scatter)，[线图](https://echarts.apache.org/zh/option.html#series-lines)，[热力图](https://echarts.apache.org/zh/option.html#series-heatmap)，[饼图](https://echarts.apache.org/zh/option.html#series-pie) 等可视化。 14 | 15 | ### 示例 16 | 17 | [Scatter 散点图](https://github.com/plainheart/echarts-extension-gmap/tree/master/examples/scatter_zh_CN.html) 18 | 19 | [Lines 线图](https://github.com/plainheart/echarts-extension-gmap/tree/master/examples/lines_zh_CN.html) 20 | 21 | [Heatmap 热力图](https://github.com/plainheart/echarts-extension-gmap/tree/master/examples/heatmap_zh_CN.html) 22 | 23 | [Pie 饼图](https://github.com/plainheart/echarts-extension-gmap/tree/master/examples/pie_zh_CN.html) 24 | 25 | ![示例](https://user-images.githubusercontent.com/26999792/202892350-5a7df14e-18ea-4f98-9a62-f55d29ad9a49.png) 26 | 27 | ### 安装 28 | 29 | ```shell 30 | npm install echarts-extension-gmap --save 31 | ``` 32 | 33 | ### 引入 34 | 35 | 可以直接引入打包好的扩展文件和谷歌地图的 Javascript API 36 | 37 | ```html 38 | 39 | 40 | 41 | 42 | 43 | 44 | ``` 45 | 46 | 如果 `webpack` 等工具打包，也可以通过 `require` 或者 `import` 引入 47 | 48 | ```js 49 | // 使用 require 50 | require('echarts'); 51 | require('echarts-extension-gmap'); 52 | 53 | // 使用 import 54 | import * as echarts from 'echarts'; 55 | import 'echarts-extension-gmap'; 56 | ``` 57 | 58 | 使用 CDN 59 | 60 | [jsdelivr](https://www.jsdelivr.com/) 61 | 62 | ```html 63 | 64 | ``` 65 | 66 | [unpkg](https://unpkg.com/) 67 | 68 | ```html 69 | 70 | ``` 71 | 72 | 插件会自动注册相应的组件。 73 | 74 | ### 使用 75 | 76 | 扩展主要提供了跟 geo 一样的坐标系和底图的绘制，因此配置方式非常简单，如下 77 | 78 | ```js 79 | option = { 80 | // 加载 gmap 组件 81 | gmap: { 82 | // 地图中心 支持数组或JSON对象 83 | //center: [108.39, 39.9], 84 | center: { lng: 108.39, lat: 39.9 }, 85 | // 缩放级别 86 | zoom: 4, 87 | // 其他地图初始化参数... 88 | // https://developers.google.cn/maps/documentation/javascript/reference/map#MapOptions 89 | 90 | // 移动过程中实时渲染。默认为 true。如数据量较大，建议置为 false。 91 | renderOnMoving: true, 92 | // 谷歌地图 ECharts 图层的 zIndex。默认为 2000。 93 | echartsLayerZIndex: 2019, 94 | // 是否启用手势事件处理，如拖拽等。默认为 true。 95 | // 此配置项从 v1.4.0 起支持 96 | roam: true 97 | }, 98 | series: [ 99 | { 100 | type: 'scatter', 101 | // 使用谷歌地图坐标系 102 | coordinateSystem: 'gmap', 103 | // 数据格式跟在 geo 坐标系上一样，每一项都是 [经度，纬度，数值大小，其它维度...] 104 | data: [[120, 30, 8], [120.1, 30.2, 20]], 105 | encode: { 106 | value: 2, 107 | lng: 0, 108 | lat: 1 109 | } 110 | } 111 | ] 112 | }; 113 | 114 | // 获取谷歌地图实例 115 | var gmap = chart 116 | .getModel() 117 | .getComponent('gmap') 118 | .getGoogleMap(); 119 | // 添加一个Marker 120 | var marker = new google.maps.Marker({ position: gmap.getCenter() }); 121 | marker.setMap(gmap); 122 | // 添加交通图层 123 | // var trafficLayer = new google.maps.TrafficLayer(); 124 | // trafficLayer.setMap(gmap); 125 | ``` 126 | -------------------------------------------------------------------------------- /build/generateExamples.js: -------------------------------------------------------------------------------- 1 | const chalk = require('chalk') 2 | const path = require('node:path') 3 | const fs = require('node:fs') 4 | const { version } = require('../package.json') 5 | 6 | function generateExamples() { 7 | const exampleDir = path.resolve(__dirname, '../examples') 8 | const libVersionMap = {} 9 | ;[['', version], ['echarts', 'latest']].forEach(function(lib) { 10 | const libName = lib[0] 11 | const libVersion = lib[1] 12 | const formattedLibName = ((libName ? libName + '_' : '') + 'version').toUpperCase() 13 | libVersionMap[formattedLibName] = ( 14 | libName 15 | ? fs.readFileSync( 16 | exampleDir + '/' + libName + '.version', 17 | { encoding: 'utf-8' } 18 | ) || lib[1] 19 | : libVersion 20 | ).trim() 21 | }) 22 | const exampleTypes = ['scatter', 'heatmap', 'lines', 'pie'] 23 | ;[['en', false], ['zh_CN']].forEach(function(lang) { 24 | lang = `${lang[1] === false ? '' : '_' + lang[0]}` 25 | exampleTypes.forEach(function(type) { 26 | const ts = Date.now() 27 | const fileName = `${type}${lang}.html` 28 | const dest = path.resolve(exampleDir, './', fileName) 29 | console.log() 30 | console.log( 31 | chalk.cyan.bold(fileName), 32 | chalk.blueBright('→'), 33 | chalk.cyan.bold(dest), 34 | chalk.cyan('...') 35 | ) 36 | const tpl = fs.readFileSync( 37 | dest + '.tpl', 38 | { encoding: 'utf-8' } 39 | ) 40 | let example = tpl 41 | Object.keys(libVersionMap).forEach(function(libVer) { 42 | example = example.replace( 43 | new RegExp(`{${libVer}}`, 'g'), 44 | libVersionMap[libVer].trim() 45 | ) 46 | }) 47 | fs.writeFileSync( 48 | dest, 49 | example, 50 | { encoding: 'utf-8' } 51 | ) 52 | const elapsed = Date.now() - ts 53 | console.log( 54 | chalk.green('Generated example'), 55 | chalk.green.bold(fileName), 56 | chalk.green('in'), 57 | chalk.green.bold(elapsed + 'ms') 58 | ) 59 | }) 60 | }) 61 | 62 | console.log() 63 | console.log(chalk.bgCyan('🚀 Generate Examples Done! ')) 64 | console.log() 65 | } 66 | 67 | generateExamples() 68 | -------------------------------------------------------------------------------- /build/header.js: -------------------------------------------------------------------------------- 1 | const fs = require('node:fs') 2 | const path = require('node:path') 3 | const { name, version, author } = require('../package.json') 4 | 5 | const COMMENT_END_REGEX = /\*\//g 6 | 7 | function getLicense(raw) { 8 | const license = fs.readFileSync( 9 | path.resolve(__dirname, '../LICENSE'), 10 | { encoding: 'utf-8' } 11 | ) 12 | const content = `${name} \n@version ${version}\n@author ${author}\n\n${license}` 13 | return raw ? content : wrapComment(content) 14 | } 15 | 16 | function toComment(str) { 17 | return str ? `/*! ${str.replace(COMMENT_END_REGEX, '* /')} */` : ''; 18 | } 19 | 20 | function wrapComment(str) { 21 | if (!str.includes('\n')) { 22 | return toComment(str) 23 | } 24 | return `/*!\n * ${str 25 | .replace(/\*\//g, '* /') 26 | .split('\n') 27 | .join('\n * ')}\n */` 28 | } 29 | 30 | module.exports = { 31 | getLicense, 32 | toComment, 33 | wrapComment 34 | } 35 | -------------------------------------------------------------------------------- /build/post-build.js: -------------------------------------------------------------------------------- 1 | const chalk = require('chalk') 2 | 3 | console.log() 4 | console.log(chalk.bgCyan('📝 Rewriting AMD dependency... ')) 5 | 6 | require('./rewrite-amd') 7 | 8 | console.log() 9 | console.log(chalk.bgCyan('✨ Build Done! ')) 10 | console.log() 11 | -------------------------------------------------------------------------------- /build/rewrite-amd.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs') 2 | const path = require('path') 3 | const chalk = require('chalk') 4 | const { name } = require('../package.json') 5 | 6 | // Replace dependency in AMD 7 | // FIXME: tricky solution 8 | const distDir = path.resolve(__dirname, '../dist') 9 | const LIB = 'echarts/lib/echarts' 10 | const REPLACED_LIB = 'echarts' 11 | const REPLACE_REGEXP = new RegExp(`define\\(\\[['"]{1}exports['"]{1}, ?['"]{1}${LIB.replace('/', '\\/')}['"]{1}\\]`) 12 | 13 | ;[name + '.js', name + '.min.js'].forEach(file => { 14 | const ts = Date.now() 15 | file = path.resolve(distDir, file) 16 | console.log() 17 | console.log(chalk.cyan.bold(file)) 18 | 19 | let content = fs.readFileSync(file,{ encoding: 'utf-8' }) 20 | 21 | // replace 22 | content = content.replace( 23 | REPLACE_REGEXP, 24 | content 25 | .match(REPLACE_REGEXP)[0] 26 | .replace(LIB, REPLACED_LIB)) 27 | 28 | // rewrite 29 | fs.writeFileSync(file, content) 30 | 31 | const elapsed = Date.now() - ts 32 | console.log( 33 | chalk.green('rewrote'), 34 | chalk.green('in'), 35 | chalk.green.bold(elapsed + 'ms'), 36 | ) 37 | }) 38 | -------------------------------------------------------------------------------- /dist/echarts-extension-gmap.cjs.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * echarts-extension-gmap 3 | * @version 1.7.0 4 | * @author plainheart 5 | * 6 | * MIT License 7 | * 8 | * Copyright (c) 2020-2024 Zhongxiang Wang 9 | * 10 | * Permission is hereby granted, free of charge, to any person obtaining a copy 11 | * of this software and associated documentation files (the "Software"), to deal 12 | * in the Software without restriction, including without limitation the rights 13 | * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 14 | * copies of the Software, and to permit persons to whom the Software is 15 | * furnished to do so, subject to the following conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be included in all 18 | * copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 21 | * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 22 | * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 23 | * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 24 | * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 25 | * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 26 | * SOFTWARE. 27 | * 28 | */ 29 | 'use strict'; 30 | 31 | var echarts = require('echarts/lib/echarts'); 32 | 33 | var ecVer = echarts.version.split('.'); 34 | var isNewEC = ecVer[0] > 4; 35 | var COMPONENT_TYPE = 'gmap'; 36 | function v2Equal(a, b) { 37 | return a && b && a[0] === b[0] && a[1] === b[1]; 38 | } 39 | 40 | /* global google */ 41 | 42 | function dataToCoordSize(dataSize, dataItem) { 43 | dataItem = dataItem || [0, 0]; 44 | return echarts.util.map([0, 1], function (dimIdx) { 45 | var val = dataItem[dimIdx]; 46 | var halfSize = dataSize[dimIdx] / 2; 47 | var p1 = []; 48 | var p2 = []; 49 | p1[dimIdx] = val - halfSize; 50 | p2[dimIdx] = val + halfSize; 51 | p1[1 - dimIdx] = p2[1 - dimIdx] = dataItem[1 - dimIdx]; 52 | return Math.abs(this.dataToPoint(p1)[dimIdx] - this.dataToPoint(p2)[dimIdx]); 53 | }, this); 54 | } 55 | function GMapCoordSys(gmap, api) { 56 | this._gmap = gmap; 57 | this.dimensions = ['lng', 'lat']; 58 | this._mapOffset = [0, 0]; 59 | this._api = api; 60 | } 61 | var GMapCoordSysProto = GMapCoordSys.prototype; 62 | 63 | // exclude private and unsupported options 64 | var excludedOptions = ['echartsLayerZIndex', 'renderOnMoving']; 65 | GMapCoordSysProto.setZoom = function (zoom) { 66 | this._zoom = zoom; 67 | }; 68 | GMapCoordSysProto.setCenter = function (center) { 69 | var latlng = new google.maps.LatLng(center[1], center[0]); 70 | this._center = latLngToPixel(latlng, this._gmap); 71 | }; 72 | GMapCoordSysProto.setMapOffset = function (mapOffset) { 73 | this._mapOffset = mapOffset; 74 | }; 75 | GMapCoordSysProto.setGoogleMap = function (gmap) { 76 | this._gmap = gmap; 77 | }; 78 | GMapCoordSysProto.getGoogleMap = function () { 79 | return this._gmap; 80 | }; 81 | GMapCoordSysProto.dataToPoint = function (data) { 82 | var latlng = new google.maps.LatLng(data[1], data[0]); 83 | var px = latLngToPixel(latlng, this._gmap); 84 | var mapOffset = this._mapOffset; 85 | return [px.x - mapOffset[0], px.y - mapOffset[1]]; 86 | }; 87 | GMapCoordSysProto.pointToData = function (pt) { 88 | var mapOffset = this._mapOffset; 89 | var latlng = pixelToLatLng(new google.maps.Point(pt[0] + mapOffset[0], pt[1] + mapOffset[1]), this._gmap); 90 | return [latlng.lng(), latlng.lat()]; 91 | }; 92 | GMapCoordSysProto.getViewRect = function () { 93 | var api = this._api; 94 | return new echarts.graphic.BoundingRect(0, 0, api.getWidth(), api.getHeight()); 95 | }; 96 | GMapCoordSysProto.getRoamTransform = function () { 97 | return echarts.matrix.create(); 98 | }; 99 | GMapCoordSysProto.prepareCustoms = function () { 100 | var rect = this.getViewRect(); 101 | return { 102 | coordSys: { 103 | type: COMPONENT_TYPE, 104 | x: rect.x, 105 | y: rect.y, 106 | width: rect.width, 107 | height: rect.height 108 | }, 109 | api: { 110 | coord: echarts.util.bind(this.dataToPoint, this), 111 | size: echarts.util.bind(dataToCoordSize, this) 112 | } 113 | }; 114 | }; 115 | GMapCoordSysProto.convertToPixel = function (ecModel, finder, value) { 116 | // here we don't use finder as only one google map component is allowed 117 | return this.dataToPoint(value); 118 | }; 119 | GMapCoordSysProto.convertFromPixel = function (ecModel, finder, value) { 120 | // here we don't use finder as only one google map component is allowed 121 | return this.pointToData(value); 122 | }; 123 | GMapCoordSys.create = function (ecModel, api) { 124 | var gmapCoordSys; 125 | var root = api.getDom(); 126 | ecModel.eachComponent(COMPONENT_TYPE, function (gmapModel) { 127 | var painter = api.getZr().painter; 128 | var viewportRoot = painter.getViewportRoot(); 129 | if (typeof google === 'undefined' || !google.maps || !google.maps.Map) { 130 | throw new Error('Google Map API is not loaded'); 131 | } 132 | Overlay = Overlay || createOverlayCtor(); 133 | if (gmapCoordSys) { 134 | throw new Error('Only one google map component is allowed'); 135 | } 136 | var gmap = gmapModel.getGoogleMap(); 137 | if (!gmap) { 138 | // Not support IE8 139 | var className = 'ec-extension-google-map'; 140 | var gmapRoot = root.querySelector('.' + className); 141 | if (gmapRoot) { 142 | // Reset viewport left and top, which will be changed 143 | // in moving handler in GMapView 144 | viewportRoot.style.left = '0'; 145 | viewportRoot.style.top = '0'; 146 | root.removeChild(gmapRoot); 147 | } 148 | gmapRoot = document.createElement('div'); 149 | gmapRoot.className = className; 150 | gmapRoot.style.cssText = 'position:absolute;top:0;left:0;right:0;bottom:0'; 151 | root.appendChild(gmapRoot); 152 | var options = echarts.util.clone(gmapModel.get()); 153 | var echartsLayerZIndex = options.echartsLayerZIndex; 154 | // delete excluded options 155 | echarts.util.each(excludedOptions, function (key) { 156 | delete options[key]; 157 | }); 158 | var _center = options.center; 159 | // normalize center 160 | if (echarts.util.isArray(_center)) { 161 | options.center = { 162 | lng: _center[0], 163 | lat: _center[1] 164 | }; 165 | } 166 | gmap = new google.maps.Map(gmapRoot, options); 167 | gmapModel.setGoogleMap(gmap); 168 | gmapModel.__projectionChangeListener && gmapModel.__projectionChangeListener.remove(); 169 | gmapModel.__projectionChangeListener = google.maps.event.addListener(gmap, 'projection_changed', function () { 170 | var layer = gmapModel.getEChartsLayer(); 171 | layer && layer.setMap(null); 172 | var overlay = new Overlay(viewportRoot, gmap); 173 | overlay.setZIndex(echartsLayerZIndex); 174 | gmapModel.setEChartsLayer(overlay); 175 | }); 176 | 177 | // Override 178 | painter.getViewportRootOffset = function () { 179 | return { 180 | offsetLeft: 0, 181 | offsetTop: 0 182 | }; 183 | }; 184 | } 185 | var center = gmapModel.get('center'); 186 | var normalizedCenter = [center.lng != null ? center.lng : center[0], center.lat != null ? center.lat : center[1]]; 187 | var zoom = gmapModel.get('zoom'); 188 | if (center && zoom) { 189 | var gmapCenter = gmap.getCenter(); 190 | var gmapZoom = gmap.getZoom(); 191 | var centerOrZoomChanged = gmapModel.centerOrZoomChanged([gmapCenter.lng(), gmapCenter.lat()], gmapZoom); 192 | if (centerOrZoomChanged) { 193 | var pt = new google.maps.LatLng(normalizedCenter[1], normalizedCenter[0]); 194 | gmap.setOptions({ 195 | center: pt, 196 | zoom: zoom 197 | }); 198 | } 199 | } 200 | gmapCoordSys = new GMapCoordSys(gmap, api); 201 | gmapCoordSys.setMapOffset(gmapModel.__mapOffset || [0, 0]); 202 | gmapCoordSys.setZoom(zoom); 203 | gmapCoordSys.setCenter(normalizedCenter); 204 | gmapModel.coordinateSystem = gmapCoordSys; 205 | }); 206 | ecModel.eachSeries(function (seriesModel) { 207 | if (seriesModel.get('coordinateSystem') === COMPONENT_TYPE) { 208 | seriesModel.coordinateSystem = gmapCoordSys; 209 | } 210 | }); 211 | 212 | // return created coordinate systems 213 | return gmapCoordSys && [gmapCoordSys]; 214 | }; 215 | var Overlay; 216 | function createOverlayCtor() { 217 | function Overlay(root, gmap) { 218 | this._root = root; 219 | this.setMap(gmap); 220 | } 221 | Overlay.prototype = new google.maps.OverlayView(); 222 | Overlay.prototype.onAdd = function () { 223 | var gmap = this.getMap(); 224 | gmap.__overlayProjection = this.getProjection(); 225 | gmap.getDiv().querySelector('.gm-style > div').appendChild(this._root); 226 | }; 227 | 228 | /** 229 | * @override 230 | */ 231 | Overlay.prototype.draw = function () { 232 | google.maps.event.trigger(this.getMap(), 'gmaprender'); 233 | }; 234 | Overlay.prototype.onRemove = function () { 235 | this._root.parentNode.removeChild(this._root); 236 | this._root = null; 237 | }; 238 | Overlay.prototype.setZIndex = function (zIndex) { 239 | this._root.style.zIndex = zIndex; 240 | }; 241 | Overlay.prototype.getZIndex = function () { 242 | return this._root.style.zIndex; 243 | }; 244 | return Overlay; 245 | } 246 | function latLngToPixel(latLng, map) { 247 | var projection = map.__overlayProjection; 248 | if (!projection) { 249 | return new google.maps.Point(-Infinity, -Infinity); 250 | } 251 | return projection.fromLatLngToContainerPixel(latLng); 252 | } 253 | function pixelToLatLng(pixel, map) { 254 | var projection = map.__overlayProjection; 255 | if (!projection) { 256 | return new google.maps.Point(-Infinity, -Infinity); 257 | } 258 | return projection.fromContainerPixelToLatLng(pixel); 259 | } 260 | GMapCoordSysProto.dimensions = GMapCoordSys.dimensions = ['lng', 'lat']; 261 | GMapCoordSysProto.type = COMPONENT_TYPE; 262 | 263 | var GMapModel = { 264 | type: COMPONENT_TYPE, 265 | setGoogleMap: function setGoogleMap(gmap) { 266 | this.__gmap = gmap; 267 | }, 268 | getGoogleMap: function getGoogleMap() { 269 | // __gmap is set when creating GMapCoordSys 270 | return this.__gmap; 271 | }, 272 | setEChartsLayer: function setEChartsLayer(layer) { 273 | this.__echartsLayer = layer; 274 | }, 275 | getEChartsLayer: function getEChartsLayer() { 276 | return this.__echartsLayer; 277 | }, 278 | setCenterAndZoom: function setCenterAndZoom(center, zoom) { 279 | this.option.center = center; 280 | this.option.zoom = zoom; 281 | }, 282 | centerOrZoomChanged: function centerOrZoomChanged(center, zoom) { 283 | var option = this.option; 284 | return !(v2Equal(center, option.center) && zoom === option.zoom); 285 | }, 286 | defaultOption: { 287 | center: { 288 | lat: 39.90923, 289 | lng: 116.397428 290 | }, 291 | zoom: 5, 292 | // extension options 293 | // since v1.4.0 294 | roam: true, 295 | echartsLayerZIndex: 2000, 296 | renderOnMoving: true 297 | } 298 | }; 299 | var GMapModel$1 = isNewEC ? echarts.ComponentModel.extend(GMapModel) : GMapModel; 300 | 301 | /* global google */ 302 | 303 | var GMapView = { 304 | type: COMPONENT_TYPE, 305 | render: function render(gmapModel, ecModel, api) { 306 | var rendering = true; 307 | var gmap = gmapModel.getGoogleMap(); 308 | var viewportRoot = api.getZr().painter.getViewportRoot(); 309 | var coordSys = gmapModel.coordinateSystem; 310 | var renderOnMoving = gmapModel.get('renderOnMoving'); 311 | var offsetEl = gmap.getDiv(); 312 | var mapEl = offsetEl.firstChild; 313 | var oldWidth = mapEl.clientWidth; 314 | var oldHeight = mapEl.clientHeight; 315 | var renderHandler = function renderHandler() { 316 | if (rendering) { 317 | return; 318 | } 319 | 320 | // reduce unnecessary resize 321 | if (mapEl.clientWidth !== oldWidth || mapEl.clientHeight !== oldHeight) { 322 | return resizeHandler(); 323 | } 324 | var mapOffset = [-parseInt(offsetEl.style.left, 10) || 0, -parseInt(offsetEl.style.top, 10) || 0]; 325 | viewportRoot.style.left = mapOffset[0] + 'px'; 326 | viewportRoot.style.top = mapOffset[1] + 'px'; 327 | coordSys.setMapOffset(mapOffset); 328 | gmapModel.__mapOffset = mapOffset; 329 | api.dispatchAction({ 330 | type: COMPONENT_TYPE + 'Roam', 331 | animation: { 332 | // in ECharts 5.x, 333 | // we can set animation duration as 0 334 | // to ensure no delay when moving or zooming 335 | duration: 0 336 | } 337 | }); 338 | }; 339 | var resizeHandler = function resizeHandler() { 340 | // fix chart can't get resized correctly after the google map enters fullscreen 341 | // See also #14 342 | echarts.getInstanceByDom(api.getDom()).resize({ 343 | width: mapEl.clientWidth, 344 | height: mapEl.clientHeight 345 | }); 346 | }; 347 | this._renderHandler && this._renderHandler.remove(); 348 | if (!renderOnMoving) { 349 | // PENDING hide layer when rendering 350 | renderHandler = echarts.throttle(renderHandler, 100, true); 351 | resizeHandler = echarts.throttle(resizeHandler, 100, true); 352 | } 353 | this._renderHandler = google.maps.event.addListener(gmap, renderOnMoving ? 'gmaprender' : 'idle', renderHandler); 354 | gmap.setOptions({ 355 | gestureHandling: gmapModel.get('roam') ? gmapModel.get('gestureHandling') || 'auto' : 'none' 356 | }); 357 | rendering = false; 358 | }, 359 | dispose: function dispose() { 360 | this._renderHandler && this._renderHandler.remove(); 361 | delete this._renderHandler; 362 | var component = this.__model; 363 | if (!component) { 364 | return; 365 | } 366 | var gmapInstance = component.getGoogleMap(); 367 | if (gmapInstance) { 368 | // remove injected projection 369 | delete gmapInstance.__overlayProjection; 370 | 371 | // clear all listeners of map instance 372 | google.maps.event.clearInstanceListeners(gmapInstance); 373 | 374 | // remove DOM of map instance 375 | var mapDiv = gmapInstance.getDiv(); 376 | mapDiv.parentNode && mapDiv.parentNode.removeChild(mapDiv); 377 | } 378 | component.setGoogleMap(null); 379 | component.setEChartsLayer(null); 380 | if (component.coordinateSystem) { 381 | component.coordinateSystem.setGoogleMap(null); 382 | component.coordinateSystem = null; 383 | } 384 | } 385 | }; 386 | var GMapView$1 = isNewEC ? echarts.ComponentView.extend(GMapView) : GMapView; 387 | 388 | var name = "echarts-extension-gmap"; 389 | var version = "1.7.0"; 390 | 391 | /** 392 | * Google Map component extension 393 | */ 394 | 395 | 396 | /** 397 | * @typedef {import('../export').EChartsExtensionRegisters} EChartsExtensionRegisters 398 | */ 399 | 400 | /** 401 | * Google Map extension installer 402 | * @param {EChartsExtensionRegisters} registers 403 | */ 404 | function install(registers) { 405 | // add coordinate system support for pie series for ECharts < 5.4.0 406 | if (!isNewEC || ecVer[0] == 5 && ecVer[1] < 4) { 407 | registers.registerLayout(function (ecModel) { 408 | ecModel.eachSeriesByType('pie', function (seriesModel) { 409 | var coordSys = seriesModel.coordinateSystem; 410 | var data = seriesModel.getData(); 411 | var valueDim = data.mapDimension('value'); 412 | if (coordSys && coordSys.type === COMPONENT_TYPE) { 413 | var center = seriesModel.get('center'); 414 | var point = coordSys.dataToPoint(center); 415 | var cx = point[0]; 416 | var cy = point[1]; 417 | data.each(valueDim, function (value, idx) { 418 | var layout = data.getItemLayout(idx); 419 | layout.cx = cx; 420 | layout.cy = cy; 421 | }); 422 | } 423 | }); 424 | }); 425 | } 426 | // Model 427 | isNewEC ? registers.registerComponentModel(GMapModel$1) : registers.extendComponentModel(GMapModel$1); 428 | // View 429 | isNewEC ? registers.registerComponentView(GMapView$1) : registers.extendComponentView(GMapView$1); 430 | // Coordinate System 431 | registers.registerCoordinateSystem(COMPONENT_TYPE, GMapCoordSys); 432 | // Action 433 | registers.registerAction({ 434 | type: COMPONENT_TYPE + 'Roam', 435 | event: COMPONENT_TYPE + 'Roam', 436 | update: 'updateLayout' 437 | }, function (payload, ecModel) { 438 | ecModel.eachComponent(COMPONENT_TYPE, function (gmapModel) { 439 | var gmap = gmapModel.getGoogleMap(); 440 | var center = gmap.getCenter(); 441 | gmapModel.setCenterAndZoom([center.lng(), center.lat()], gmap.getZoom()); 442 | }); 443 | }); 444 | } 445 | 446 | isNewEC ? echarts.use(install) : install(echarts); 447 | 448 | exports.name = name; 449 | exports.version = version; 450 | -------------------------------------------------------------------------------- /dist/echarts-extension-gmap.esm.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * echarts-extension-gmap 3 | * @version 1.7.0 4 | * @author plainheart 5 | * 6 | * MIT License 7 | * 8 | * Copyright (c) 2020-2024 Zhongxiang Wang 9 | * 10 | * Permission is hereby granted, free of charge, to any person obtaining a copy 11 | * of this software and associated documentation files (the "Software"), to deal 12 | * in the Software without restriction, including without limitation the rights 13 | * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 14 | * copies of the Software, and to permit persons to whom the Software is 15 | * furnished to do so, subject to the following conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be included in all 18 | * copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 21 | * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 22 | * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 23 | * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 24 | * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 25 | * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 26 | * SOFTWARE. 27 | * 28 | */ 29 | import * as echarts from 'echarts/lib/echarts'; 30 | import { version as version$1, graphic, matrix, util, ComponentModel, ComponentView, throttle, getInstanceByDom } from 'echarts/lib/echarts'; 31 | 32 | var ecVer = version$1.split('.'); 33 | var isNewEC = ecVer[0] > 4; 34 | var COMPONENT_TYPE = 'gmap'; 35 | function v2Equal(a, b) { 36 | return a && b && a[0] === b[0] && a[1] === b[1]; 37 | } 38 | 39 | /* global google */ 40 | 41 | function dataToCoordSize(dataSize, dataItem) { 42 | dataItem = dataItem || [0, 0]; 43 | return util.map([0, 1], function (dimIdx) { 44 | var val = dataItem[dimIdx]; 45 | var halfSize = dataSize[dimIdx] / 2; 46 | var p1 = []; 47 | var p2 = []; 48 | p1[dimIdx] = val - halfSize; 49 | p2[dimIdx] = val + halfSize; 50 | p1[1 - dimIdx] = p2[1 - dimIdx] = dataItem[1 - dimIdx]; 51 | return Math.abs(this.dataToPoint(p1)[dimIdx] - this.dataToPoint(p2)[dimIdx]); 52 | }, this); 53 | } 54 | function GMapCoordSys(gmap, api) { 55 | this._gmap = gmap; 56 | this.dimensions = ['lng', 'lat']; 57 | this._mapOffset = [0, 0]; 58 | this._api = api; 59 | } 60 | var GMapCoordSysProto = GMapCoordSys.prototype; 61 | 62 | // exclude private and unsupported options 63 | var excludedOptions = ['echartsLayerZIndex', 'renderOnMoving']; 64 | GMapCoordSysProto.setZoom = function (zoom) { 65 | this._zoom = zoom; 66 | }; 67 | GMapCoordSysProto.setCenter = function (center) { 68 | var latlng = new google.maps.LatLng(center[1], center[0]); 69 | this._center = latLngToPixel(latlng, this._gmap); 70 | }; 71 | GMapCoordSysProto.setMapOffset = function (mapOffset) { 72 | this._mapOffset = mapOffset; 73 | }; 74 | GMapCoordSysProto.setGoogleMap = function (gmap) { 75 | this._gmap = gmap; 76 | }; 77 | GMapCoordSysProto.getGoogleMap = function () { 78 | return this._gmap; 79 | }; 80 | GMapCoordSysProto.dataToPoint = function (data) { 81 | var latlng = new google.maps.LatLng(data[1], data[0]); 82 | var px = latLngToPixel(latlng, this._gmap); 83 | var mapOffset = this._mapOffset; 84 | return [px.x - mapOffset[0], px.y - mapOffset[1]]; 85 | }; 86 | GMapCoordSysProto.pointToData = function (pt) { 87 | var mapOffset = this._mapOffset; 88 | var latlng = pixelToLatLng(new google.maps.Point(pt[0] + mapOffset[0], pt[1] + mapOffset[1]), this._gmap); 89 | return [latlng.lng(), latlng.lat()]; 90 | }; 91 | GMapCoordSysProto.getViewRect = function () { 92 | var api = this._api; 93 | return new graphic.BoundingRect(0, 0, api.getWidth(), api.getHeight()); 94 | }; 95 | GMapCoordSysProto.getRoamTransform = function () { 96 | return matrix.create(); 97 | }; 98 | GMapCoordSysProto.prepareCustoms = function () { 99 | var rect = this.getViewRect(); 100 | return { 101 | coordSys: { 102 | type: COMPONENT_TYPE, 103 | x: rect.x, 104 | y: rect.y, 105 | width: rect.width, 106 | height: rect.height 107 | }, 108 | api: { 109 | coord: util.bind(this.dataToPoint, this), 110 | size: util.bind(dataToCoordSize, this) 111 | } 112 | }; 113 | }; 114 | GMapCoordSysProto.convertToPixel = function (ecModel, finder, value) { 115 | // here we don't use finder as only one google map component is allowed 116 | return this.dataToPoint(value); 117 | }; 118 | GMapCoordSysProto.convertFromPixel = function (ecModel, finder, value) { 119 | // here we don't use finder as only one google map component is allowed 120 | return this.pointToData(value); 121 | }; 122 | GMapCoordSys.create = function (ecModel, api) { 123 | var gmapCoordSys; 124 | var root = api.getDom(); 125 | ecModel.eachComponent(COMPONENT_TYPE, function (gmapModel) { 126 | var painter = api.getZr().painter; 127 | var viewportRoot = painter.getViewportRoot(); 128 | if (typeof google === 'undefined' || !google.maps || !google.maps.Map) { 129 | throw new Error('Google Map API is not loaded'); 130 | } 131 | Overlay = Overlay || createOverlayCtor(); 132 | if (gmapCoordSys) { 133 | throw new Error('Only one google map component is allowed'); 134 | } 135 | var gmap = gmapModel.getGoogleMap(); 136 | if (!gmap) { 137 | // Not support IE8 138 | var className = 'ec-extension-google-map'; 139 | var gmapRoot = root.querySelector('.' + className); 140 | if (gmapRoot) { 141 | // Reset viewport left and top, which will be changed 142 | // in moving handler in GMapView 143 | viewportRoot.style.left = '0'; 144 | viewportRoot.style.top = '0'; 145 | root.removeChild(gmapRoot); 146 | } 147 | gmapRoot = document.createElement('div'); 148 | gmapRoot.className = className; 149 | gmapRoot.style.cssText = 'position:absolute;top:0;left:0;right:0;bottom:0'; 150 | root.appendChild(gmapRoot); 151 | var options = util.clone(gmapModel.get()); 152 | var echartsLayerZIndex = options.echartsLayerZIndex; 153 | // delete excluded options 154 | util.each(excludedOptions, function (key) { 155 | delete options[key]; 156 | }); 157 | var _center = options.center; 158 | // normalize center 159 | if (util.isArray(_center)) { 160 | options.center = { 161 | lng: _center[0], 162 | lat: _center[1] 163 | }; 164 | } 165 | gmap = new google.maps.Map(gmapRoot, options); 166 | gmapModel.setGoogleMap(gmap); 167 | gmapModel.__projectionChangeListener && gmapModel.__projectionChangeListener.remove(); 168 | gmapModel.__projectionChangeListener = google.maps.event.addListener(gmap, 'projection_changed', function () { 169 | var layer = gmapModel.getEChartsLayer(); 170 | layer && layer.setMap(null); 171 | var overlay = new Overlay(viewportRoot, gmap); 172 | overlay.setZIndex(echartsLayerZIndex); 173 | gmapModel.setEChartsLayer(overlay); 174 | }); 175 | 176 | // Override 177 | painter.getViewportRootOffset = function () { 178 | return { 179 | offsetLeft: 0, 180 | offsetTop: 0 181 | }; 182 | }; 183 | } 184 | var center = gmapModel.get('center'); 185 | var normalizedCenter = [center.lng != null ? center.lng : center[0], center.lat != null ? center.lat : center[1]]; 186 | var zoom = gmapModel.get('zoom'); 187 | if (center && zoom) { 188 | var gmapCenter = gmap.getCenter(); 189 | var gmapZoom = gmap.getZoom(); 190 | var centerOrZoomChanged = gmapModel.centerOrZoomChanged([gmapCenter.lng(), gmapCenter.lat()], gmapZoom); 191 | if (centerOrZoomChanged) { 192 | var pt = new google.maps.LatLng(normalizedCenter[1], normalizedCenter[0]); 193 | gmap.setOptions({ 194 | center: pt, 195 | zoom: zoom 196 | }); 197 | } 198 | } 199 | gmapCoordSys = new GMapCoordSys(gmap, api); 200 | gmapCoordSys.setMapOffset(gmapModel.__mapOffset || [0, 0]); 201 | gmapCoordSys.setZoom(zoom); 202 | gmapCoordSys.setCenter(normalizedCenter); 203 | gmapModel.coordinateSystem = gmapCoordSys; 204 | }); 205 | ecModel.eachSeries(function (seriesModel) { 206 | if (seriesModel.get('coordinateSystem') === COMPONENT_TYPE) { 207 | seriesModel.coordinateSystem = gmapCoordSys; 208 | } 209 | }); 210 | 211 | // return created coordinate systems 212 | return gmapCoordSys && [gmapCoordSys]; 213 | }; 214 | var Overlay; 215 | function createOverlayCtor() { 216 | function Overlay(root, gmap) { 217 | this._root = root; 218 | this.setMap(gmap); 219 | } 220 | Overlay.prototype = new google.maps.OverlayView(); 221 | Overlay.prototype.onAdd = function () { 222 | var gmap = this.getMap(); 223 | gmap.__overlayProjection = this.getProjection(); 224 | gmap.getDiv().querySelector('.gm-style > div').appendChild(this._root); 225 | }; 226 | 227 | /** 228 | * @override 229 | */ 230 | Overlay.prototype.draw = function () { 231 | google.maps.event.trigger(this.getMap(), 'gmaprender'); 232 | }; 233 | Overlay.prototype.onRemove = function () { 234 | this._root.parentNode.removeChild(this._root); 235 | this._root = null; 236 | }; 237 | Overlay.prototype.setZIndex = function (zIndex) { 238 | this._root.style.zIndex = zIndex; 239 | }; 240 | Overlay.prototype.getZIndex = function () { 241 | return this._root.style.zIndex; 242 | }; 243 | return Overlay; 244 | } 245 | function latLngToPixel(latLng, map) { 246 | var projection = map.__overlayProjection; 247 | if (!projection) { 248 | return new google.maps.Point(-Infinity, -Infinity); 249 | } 250 | return projection.fromLatLngToContainerPixel(latLng); 251 | } 252 | function pixelToLatLng(pixel, map) { 253 | var projection = map.__overlayProjection; 254 | if (!projection) { 255 | return new google.maps.Point(-Infinity, -Infinity); 256 | } 257 | return projection.fromContainerPixelToLatLng(pixel); 258 | } 259 | GMapCoordSysProto.dimensions = GMapCoordSys.dimensions = ['lng', 'lat']; 260 | GMapCoordSysProto.type = COMPONENT_TYPE; 261 | 262 | var GMapModel = { 263 | type: COMPONENT_TYPE, 264 | setGoogleMap: function setGoogleMap(gmap) { 265 | this.__gmap = gmap; 266 | }, 267 | getGoogleMap: function getGoogleMap() { 268 | // __gmap is set when creating GMapCoordSys 269 | return this.__gmap; 270 | }, 271 | setEChartsLayer: function setEChartsLayer(layer) { 272 | this.__echartsLayer = layer; 273 | }, 274 | getEChartsLayer: function getEChartsLayer() { 275 | return this.__echartsLayer; 276 | }, 277 | setCenterAndZoom: function setCenterAndZoom(center, zoom) { 278 | this.option.center = center; 279 | this.option.zoom = zoom; 280 | }, 281 | centerOrZoomChanged: function centerOrZoomChanged(center, zoom) { 282 | var option = this.option; 283 | return !(v2Equal(center, option.center) && zoom === option.zoom); 284 | }, 285 | defaultOption: { 286 | center: { 287 | lat: 39.90923, 288 | lng: 116.397428 289 | }, 290 | zoom: 5, 291 | // extension options 292 | // since v1.4.0 293 | roam: true, 294 | echartsLayerZIndex: 2000, 295 | renderOnMoving: true 296 | } 297 | }; 298 | var GMapModel$1 = isNewEC ? ComponentModel.extend(GMapModel) : GMapModel; 299 | 300 | /* global google */ 301 | 302 | var GMapView = { 303 | type: COMPONENT_TYPE, 304 | render: function render(gmapModel, ecModel, api) { 305 | var rendering = true; 306 | var gmap = gmapModel.getGoogleMap(); 307 | var viewportRoot = api.getZr().painter.getViewportRoot(); 308 | var coordSys = gmapModel.coordinateSystem; 309 | var renderOnMoving = gmapModel.get('renderOnMoving'); 310 | var offsetEl = gmap.getDiv(); 311 | var mapEl = offsetEl.firstChild; 312 | var oldWidth = mapEl.clientWidth; 313 | var oldHeight = mapEl.clientHeight; 314 | var renderHandler = function renderHandler() { 315 | if (rendering) { 316 | return; 317 | } 318 | 319 | // reduce unnecessary resize 320 | if (mapEl.clientWidth !== oldWidth || mapEl.clientHeight !== oldHeight) { 321 | return resizeHandler(); 322 | } 323 | var mapOffset = [-parseInt(offsetEl.style.left, 10) || 0, -parseInt(offsetEl.style.top, 10) || 0]; 324 | viewportRoot.style.left = mapOffset[0] + 'px'; 325 | viewportRoot.style.top = mapOffset[1] + 'px'; 326 | coordSys.setMapOffset(mapOffset); 327 | gmapModel.__mapOffset = mapOffset; 328 | api.dispatchAction({ 329 | type: COMPONENT_TYPE + 'Roam', 330 | animation: { 331 | // in ECharts 5.x, 332 | // we can set animation duration as 0 333 | // to ensure no delay when moving or zooming 334 | duration: 0 335 | } 336 | }); 337 | }; 338 | var resizeHandler = function resizeHandler() { 339 | // fix chart can't get resized correctly after the google map enters fullscreen 340 | // See also #14 341 | getInstanceByDom(api.getDom()).resize({ 342 | width: mapEl.clientWidth, 343 | height: mapEl.clientHeight 344 | }); 345 | }; 346 | this._renderHandler && this._renderHandler.remove(); 347 | if (!renderOnMoving) { 348 | // PENDING hide layer when rendering 349 | renderHandler = throttle(renderHandler, 100, true); 350 | resizeHandler = throttle(resizeHandler, 100, true); 351 | } 352 | this._renderHandler = google.maps.event.addListener(gmap, renderOnMoving ? 'gmaprender' : 'idle', renderHandler); 353 | gmap.setOptions({ 354 | gestureHandling: gmapModel.get('roam') ? gmapModel.get('gestureHandling') || 'auto' : 'none' 355 | }); 356 | rendering = false; 357 | }, 358 | dispose: function dispose() { 359 | this._renderHandler && this._renderHandler.remove(); 360 | delete this._renderHandler; 361 | var component = this.__model; 362 | if (!component) { 363 | return; 364 | } 365 | var gmapInstance = component.getGoogleMap(); 366 | if (gmapInstance) { 367 | // remove injected projection 368 | delete gmapInstance.__overlayProjection; 369 | 370 | // clear all listeners of map instance 371 | google.maps.event.clearInstanceListeners(gmapInstance); 372 | 373 | // remove DOM of map instance 374 | var mapDiv = gmapInstance.getDiv(); 375 | mapDiv.parentNode && mapDiv.parentNode.removeChild(mapDiv); 376 | } 377 | component.setGoogleMap(null); 378 | component.setEChartsLayer(null); 379 | if (component.coordinateSystem) { 380 | component.coordinateSystem.setGoogleMap(null); 381 | component.coordinateSystem = null; 382 | } 383 | } 384 | }; 385 | var GMapView$1 = isNewEC ? ComponentView.extend(GMapView) : GMapView; 386 | 387 | var name = "echarts-extension-gmap"; 388 | var version = "1.7.0"; 389 | 390 | /** 391 | * Google Map component extension 392 | */ 393 | 394 | 395 | /** 396 | * @typedef {import('../export').EChartsExtensionRegisters} EChartsExtensionRegisters 397 | */ 398 | 399 | /** 400 | * Google Map extension installer 401 | * @param {EChartsExtensionRegisters} registers 402 | */ 403 | function install(registers) { 404 | // add coordinate system support for pie series for ECharts < 5.4.0 405 | if (!isNewEC || ecVer[0] == 5 && ecVer[1] < 4) { 406 | registers.registerLayout(function (ecModel) { 407 | ecModel.eachSeriesByType('pie', function (seriesModel) { 408 | var coordSys = seriesModel.coordinateSystem; 409 | var data = seriesModel.getData(); 410 | var valueDim = data.mapDimension('value'); 411 | if (coordSys && coordSys.type === COMPONENT_TYPE) { 412 | var center = seriesModel.get('center'); 413 | var point = coordSys.dataToPoint(center); 414 | var cx = point[0]; 415 | var cy = point[1]; 416 | data.each(valueDim, function (value, idx) { 417 | var layout = data.getItemLayout(idx); 418 | layout.cx = cx; 419 | layout.cy = cy; 420 | }); 421 | } 422 | }); 423 | }); 424 | } 425 | // Model 426 | isNewEC ? registers.registerComponentModel(GMapModel$1) : registers.extendComponentModel(GMapModel$1); 427 | // View 428 | isNewEC ? registers.registerComponentView(GMapView$1) : registers.extendComponentView(GMapView$1); 429 | // Coordinate System 430 | registers.registerCoordinateSystem(COMPONENT_TYPE, GMapCoordSys); 431 | // Action 432 | registers.registerAction({ 433 | type: COMPONENT_TYPE + 'Roam', 434 | event: COMPONENT_TYPE + 'Roam', 435 | update: 'updateLayout' 436 | }, function (payload, ecModel) { 437 | ecModel.eachComponent(COMPONENT_TYPE, function (gmapModel) { 438 | var gmap = gmapModel.getGoogleMap(); 439 | var center = gmap.getCenter(); 440 | gmapModel.setCenterAndZoom([center.lng(), center.lat()], gmap.getZoom()); 441 | }); 442 | }); 443 | } 444 | 445 | isNewEC ? echarts.use(install) : install(echarts); 446 | 447 | export { name, version }; 448 | -------------------------------------------------------------------------------- /dist/echarts-extension-gmap.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * echarts-extension-gmap 3 | * @version 1.7.0 4 | * @author plainheart 5 | * 6 | * MIT License 7 | * 8 | * Copyright (c) 2020-2024 Zhongxiang Wang 9 | * 10 | * Permission is hereby granted, free of charge, to any person obtaining a copy 11 | * of this software and associated documentation files (the "Software"), to deal 12 | * in the Software without restriction, including without limitation the rights 13 | * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 14 | * copies of the Software, and to permit persons to whom the Software is 15 | * furnished to do so, subject to the following conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be included in all 18 | * copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 21 | * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 22 | * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 23 | * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 24 | * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 25 | * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 26 | * SOFTWARE. 27 | * 28 | */ 29 | (function (global, factory) { 30 | typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('echarts/lib/echarts')) : 31 | typeof define === 'function' && define.amd ? define(['exports', 'echarts'], factory) : 32 | (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.echarts = global.echarts || {}, global.echarts.gmap = {}), global.echarts)); 33 | })(this, (function (exports, echarts) { 'use strict'; 34 | 35 | var ecVer = echarts.version.split('.'); 36 | var isNewEC = ecVer[0] > 4; 37 | var COMPONENT_TYPE = 'gmap'; 38 | function v2Equal(a, b) { 39 | return a && b && a[0] === b[0] && a[1] === b[1]; 40 | } 41 | 42 | /* global google */ 43 | 44 | function dataToCoordSize(dataSize, dataItem) { 45 | dataItem = dataItem || [0, 0]; 46 | return echarts.util.map([0, 1], function (dimIdx) { 47 | var val = dataItem[dimIdx]; 48 | var halfSize = dataSize[dimIdx] / 2; 49 | var p1 = []; 50 | var p2 = []; 51 | p1[dimIdx] = val - halfSize; 52 | p2[dimIdx] = val + halfSize; 53 | p1[1 - dimIdx] = p2[1 - dimIdx] = dataItem[1 - dimIdx]; 54 | return Math.abs(this.dataToPoint(p1)[dimIdx] - this.dataToPoint(p2)[dimIdx]); 55 | }, this); 56 | } 57 | function GMapCoordSys(gmap, api) { 58 | this._gmap = gmap; 59 | this.dimensions = ['lng', 'lat']; 60 | this._mapOffset = [0, 0]; 61 | this._api = api; 62 | } 63 | var GMapCoordSysProto = GMapCoordSys.prototype; 64 | 65 | // exclude private and unsupported options 66 | var excludedOptions = ['echartsLayerZIndex', 'renderOnMoving']; 67 | GMapCoordSysProto.setZoom = function (zoom) { 68 | this._zoom = zoom; 69 | }; 70 | GMapCoordSysProto.setCenter = function (center) { 71 | var latlng = new google.maps.LatLng(center[1], center[0]); 72 | this._center = latLngToPixel(latlng, this._gmap); 73 | }; 74 | GMapCoordSysProto.setMapOffset = function (mapOffset) { 75 | this._mapOffset = mapOffset; 76 | }; 77 | GMapCoordSysProto.setGoogleMap = function (gmap) { 78 | this._gmap = gmap; 79 | }; 80 | GMapCoordSysProto.getGoogleMap = function () { 81 | return this._gmap; 82 | }; 83 | GMapCoordSysProto.dataToPoint = function (data) { 84 | var latlng = new google.maps.LatLng(data[1], data[0]); 85 | var px = latLngToPixel(latlng, this._gmap); 86 | var mapOffset = this._mapOffset; 87 | return [px.x - mapOffset[0], px.y - mapOffset[1]]; 88 | }; 89 | GMapCoordSysProto.pointToData = function (pt) { 90 | var mapOffset = this._mapOffset; 91 | var latlng = pixelToLatLng(new google.maps.Point(pt[0] + mapOffset[0], pt[1] + mapOffset[1]), this._gmap); 92 | return [latlng.lng(), latlng.lat()]; 93 | }; 94 | GMapCoordSysProto.getViewRect = function () { 95 | var api = this._api; 96 | return new echarts.graphic.BoundingRect(0, 0, api.getWidth(), api.getHeight()); 97 | }; 98 | GMapCoordSysProto.getRoamTransform = function () { 99 | return echarts.matrix.create(); 100 | }; 101 | GMapCoordSysProto.prepareCustoms = function () { 102 | var rect = this.getViewRect(); 103 | return { 104 | coordSys: { 105 | type: COMPONENT_TYPE, 106 | x: rect.x, 107 | y: rect.y, 108 | width: rect.width, 109 | height: rect.height 110 | }, 111 | api: { 112 | coord: echarts.util.bind(this.dataToPoint, this), 113 | size: echarts.util.bind(dataToCoordSize, this) 114 | } 115 | }; 116 | }; 117 | GMapCoordSysProto.convertToPixel = function (ecModel, finder, value) { 118 | // here we don't use finder as only one google map component is allowed 119 | return this.dataToPoint(value); 120 | }; 121 | GMapCoordSysProto.convertFromPixel = function (ecModel, finder, value) { 122 | // here we don't use finder as only one google map component is allowed 123 | return this.pointToData(value); 124 | }; 125 | GMapCoordSys.create = function (ecModel, api) { 126 | var gmapCoordSys; 127 | var root = api.getDom(); 128 | ecModel.eachComponent(COMPONENT_TYPE, function (gmapModel) { 129 | var painter = api.getZr().painter; 130 | var viewportRoot = painter.getViewportRoot(); 131 | if (typeof google === 'undefined' || !google.maps || !google.maps.Map) { 132 | throw new Error('Google Map API is not loaded'); 133 | } 134 | Overlay = Overlay || createOverlayCtor(); 135 | if (gmapCoordSys) { 136 | throw new Error('Only one google map component is allowed'); 137 | } 138 | var gmap = gmapModel.getGoogleMap(); 139 | if (!gmap) { 140 | // Not support IE8 141 | var className = 'ec-extension-google-map'; 142 | var gmapRoot = root.querySelector('.' + className); 143 | if (gmapRoot) { 144 | // Reset viewport left and top, which will be changed 145 | // in moving handler in GMapView 146 | viewportRoot.style.left = '0'; 147 | viewportRoot.style.top = '0'; 148 | root.removeChild(gmapRoot); 149 | } 150 | gmapRoot = document.createElement('div'); 151 | gmapRoot.className = className; 152 | gmapRoot.style.cssText = 'position:absolute;top:0;left:0;right:0;bottom:0'; 153 | root.appendChild(gmapRoot); 154 | var options = echarts.util.clone(gmapModel.get()); 155 | var echartsLayerZIndex = options.echartsLayerZIndex; 156 | // delete excluded options 157 | echarts.util.each(excludedOptions, function (key) { 158 | delete options[key]; 159 | }); 160 | var _center = options.center; 161 | // normalize center 162 | if (echarts.util.isArray(_center)) { 163 | options.center = { 164 | lng: _center[0], 165 | lat: _center[1] 166 | }; 167 | } 168 | gmap = new google.maps.Map(gmapRoot, options); 169 | gmapModel.setGoogleMap(gmap); 170 | gmapModel.__projectionChangeListener && gmapModel.__projectionChangeListener.remove(); 171 | gmapModel.__projectionChangeListener = google.maps.event.addListener(gmap, 'projection_changed', function () { 172 | var layer = gmapModel.getEChartsLayer(); 173 | layer && layer.setMap(null); 174 | var overlay = new Overlay(viewportRoot, gmap); 175 | overlay.setZIndex(echartsLayerZIndex); 176 | gmapModel.setEChartsLayer(overlay); 177 | }); 178 | 179 | // Override 180 | painter.getViewportRootOffset = function () { 181 | return { 182 | offsetLeft: 0, 183 | offsetTop: 0 184 | }; 185 | }; 186 | } 187 | var center = gmapModel.get('center'); 188 | var normalizedCenter = [center.lng != null ? center.lng : center[0], center.lat != null ? center.lat : center[1]]; 189 | var zoom = gmapModel.get('zoom'); 190 | if (center && zoom) { 191 | var gmapCenter = gmap.getCenter(); 192 | var gmapZoom = gmap.getZoom(); 193 | var centerOrZoomChanged = gmapModel.centerOrZoomChanged([gmapCenter.lng(), gmapCenter.lat()], gmapZoom); 194 | if (centerOrZoomChanged) { 195 | var pt = new google.maps.LatLng(normalizedCenter[1], normalizedCenter[0]); 196 | gmap.setOptions({ 197 | center: pt, 198 | zoom: zoom 199 | }); 200 | } 201 | } 202 | gmapCoordSys = new GMapCoordSys(gmap, api); 203 | gmapCoordSys.setMapOffset(gmapModel.__mapOffset || [0, 0]); 204 | gmapCoordSys.setZoom(zoom); 205 | gmapCoordSys.setCenter(normalizedCenter); 206 | gmapModel.coordinateSystem = gmapCoordSys; 207 | }); 208 | ecModel.eachSeries(function (seriesModel) { 209 | if (seriesModel.get('coordinateSystem') === COMPONENT_TYPE) { 210 | seriesModel.coordinateSystem = gmapCoordSys; 211 | } 212 | }); 213 | 214 | // return created coordinate systems 215 | return gmapCoordSys && [gmapCoordSys]; 216 | }; 217 | var Overlay; 218 | function createOverlayCtor() { 219 | function Overlay(root, gmap) { 220 | this._root = root; 221 | this.setMap(gmap); 222 | } 223 | Overlay.prototype = new google.maps.OverlayView(); 224 | Overlay.prototype.onAdd = function () { 225 | var gmap = this.getMap(); 226 | gmap.__overlayProjection = this.getProjection(); 227 | gmap.getDiv().querySelector('.gm-style > div').appendChild(this._root); 228 | }; 229 | 230 | /** 231 | * @override 232 | */ 233 | Overlay.prototype.draw = function () { 234 | google.maps.event.trigger(this.getMap(), 'gmaprender'); 235 | }; 236 | Overlay.prototype.onRemove = function () { 237 | this._root.parentNode.removeChild(this._root); 238 | this._root = null; 239 | }; 240 | Overlay.prototype.setZIndex = function (zIndex) { 241 | this._root.style.zIndex = zIndex; 242 | }; 243 | Overlay.prototype.getZIndex = function () { 244 | return this._root.style.zIndex; 245 | }; 246 | return Overlay; 247 | } 248 | function latLngToPixel(latLng, map) { 249 | var projection = map.__overlayProjection; 250 | if (!projection) { 251 | return new google.maps.Point(-Infinity, -Infinity); 252 | } 253 | return projection.fromLatLngToContainerPixel(latLng); 254 | } 255 | function pixelToLatLng(pixel, map) { 256 | var projection = map.__overlayProjection; 257 | if (!projection) { 258 | return new google.maps.Point(-Infinity, -Infinity); 259 | } 260 | return projection.fromContainerPixelToLatLng(pixel); 261 | } 262 | GMapCoordSysProto.dimensions = GMapCoordSys.dimensions = ['lng', 'lat']; 263 | GMapCoordSysProto.type = COMPONENT_TYPE; 264 | 265 | var GMapModel = { 266 | type: COMPONENT_TYPE, 267 | setGoogleMap: function setGoogleMap(gmap) { 268 | this.__gmap = gmap; 269 | }, 270 | getGoogleMap: function getGoogleMap() { 271 | // __gmap is set when creating GMapCoordSys 272 | return this.__gmap; 273 | }, 274 | setEChartsLayer: function setEChartsLayer(layer) { 275 | this.__echartsLayer = layer; 276 | }, 277 | getEChartsLayer: function getEChartsLayer() { 278 | return this.__echartsLayer; 279 | }, 280 | setCenterAndZoom: function setCenterAndZoom(center, zoom) { 281 | this.option.center = center; 282 | this.option.zoom = zoom; 283 | }, 284 | centerOrZoomChanged: function centerOrZoomChanged(center, zoom) { 285 | var option = this.option; 286 | return !(v2Equal(center, option.center) && zoom === option.zoom); 287 | }, 288 | defaultOption: { 289 | center: { 290 | lat: 39.90923, 291 | lng: 116.397428 292 | }, 293 | zoom: 5, 294 | // extension options 295 | // since v1.4.0 296 | roam: true, 297 | echartsLayerZIndex: 2000, 298 | renderOnMoving: true 299 | } 300 | }; 301 | var GMapModel$1 = isNewEC ? echarts.ComponentModel.extend(GMapModel) : GMapModel; 302 | 303 | /* global google */ 304 | 305 | var GMapView = { 306 | type: COMPONENT_TYPE, 307 | render: function render(gmapModel, ecModel, api) { 308 | var rendering = true; 309 | var gmap = gmapModel.getGoogleMap(); 310 | var viewportRoot = api.getZr().painter.getViewportRoot(); 311 | var coordSys = gmapModel.coordinateSystem; 312 | var renderOnMoving = gmapModel.get('renderOnMoving'); 313 | var offsetEl = gmap.getDiv(); 314 | var mapEl = offsetEl.firstChild; 315 | var oldWidth = mapEl.clientWidth; 316 | var oldHeight = mapEl.clientHeight; 317 | var renderHandler = function renderHandler() { 318 | if (rendering) { 319 | return; 320 | } 321 | 322 | // reduce unnecessary resize 323 | if (mapEl.clientWidth !== oldWidth || mapEl.clientHeight !== oldHeight) { 324 | return resizeHandler(); 325 | } 326 | var mapOffset = [-parseInt(offsetEl.style.left, 10) || 0, -parseInt(offsetEl.style.top, 10) || 0]; 327 | viewportRoot.style.left = mapOffset[0] + 'px'; 328 | viewportRoot.style.top = mapOffset[1] + 'px'; 329 | coordSys.setMapOffset(mapOffset); 330 | gmapModel.__mapOffset = mapOffset; 331 | api.dispatchAction({ 332 | type: COMPONENT_TYPE + 'Roam', 333 | animation: { 334 | // in ECharts 5.x, 335 | // we can set animation duration as 0 336 | // to ensure no delay when moving or zooming 337 | duration: 0 338 | } 339 | }); 340 | }; 341 | var resizeHandler = function resizeHandler() { 342 | // fix chart can't get resized correctly after the google map enters fullscreen 343 | // See also #14 344 | echarts.getInstanceByDom(api.getDom()).resize({ 345 | width: mapEl.clientWidth, 346 | height: mapEl.clientHeight 347 | }); 348 | }; 349 | this._renderHandler && this._renderHandler.remove(); 350 | if (!renderOnMoving) { 351 | // PENDING hide layer when rendering 352 | renderHandler = echarts.throttle(renderHandler, 100, true); 353 | resizeHandler = echarts.throttle(resizeHandler, 100, true); 354 | } 355 | this._renderHandler = google.maps.event.addListener(gmap, renderOnMoving ? 'gmaprender' : 'idle', renderHandler); 356 | gmap.setOptions({ 357 | gestureHandling: gmapModel.get('roam') ? gmapModel.get('gestureHandling') || 'auto' : 'none' 358 | }); 359 | rendering = false; 360 | }, 361 | dispose: function dispose() { 362 | this._renderHandler && this._renderHandler.remove(); 363 | delete this._renderHandler; 364 | var component = this.__model; 365 | if (!component) { 366 | return; 367 | } 368 | var gmapInstance = component.getGoogleMap(); 369 | if (gmapInstance) { 370 | // remove injected projection 371 | delete gmapInstance.__overlayProjection; 372 | 373 | // clear all listeners of map instance 374 | google.maps.event.clearInstanceListeners(gmapInstance); 375 | 376 | // remove DOM of map instance 377 | var mapDiv = gmapInstance.getDiv(); 378 | mapDiv.parentNode && mapDiv.parentNode.removeChild(mapDiv); 379 | } 380 | component.setGoogleMap(null); 381 | component.setEChartsLayer(null); 382 | if (component.coordinateSystem) { 383 | component.coordinateSystem.setGoogleMap(null); 384 | component.coordinateSystem = null; 385 | } 386 | } 387 | }; 388 | var GMapView$1 = isNewEC ? echarts.ComponentView.extend(GMapView) : GMapView; 389 | 390 | var name = "echarts-extension-gmap"; 391 | var version = "1.7.0"; 392 | 393 | /** 394 | * Google Map component extension 395 | */ 396 | 397 | 398 | /** 399 | * @typedef {import('../export').EChartsExtensionRegisters} EChartsExtensionRegisters 400 | */ 401 | 402 | /** 403 | * Google Map extension installer 404 | * @param {EChartsExtensionRegisters} registers 405 | */ 406 | function install(registers) { 407 | // add coordinate system support for pie series for ECharts < 5.4.0 408 | if (!isNewEC || ecVer[0] == 5 && ecVer[1] < 4) { 409 | registers.registerLayout(function (ecModel) { 410 | ecModel.eachSeriesByType('pie', function (seriesModel) { 411 | var coordSys = seriesModel.coordinateSystem; 412 | var data = seriesModel.getData(); 413 | var valueDim = data.mapDimension('value'); 414 | if (coordSys && coordSys.type === COMPONENT_TYPE) { 415 | var center = seriesModel.get('center'); 416 | var point = coordSys.dataToPoint(center); 417 | var cx = point[0]; 418 | var cy = point[1]; 419 | data.each(valueDim, function (value, idx) { 420 | var layout = data.getItemLayout(idx); 421 | layout.cx = cx; 422 | layout.cy = cy; 423 | }); 424 | } 425 | }); 426 | }); 427 | } 428 | // Model 429 | isNewEC ? registers.registerComponentModel(GMapModel$1) : registers.extendComponentModel(GMapModel$1); 430 | // View 431 | isNewEC ? registers.registerComponentView(GMapView$1) : registers.extendComponentView(GMapView$1); 432 | // Coordinate System 433 | registers.registerCoordinateSystem(COMPONENT_TYPE, GMapCoordSys); 434 | // Action 435 | registers.registerAction({ 436 | type: COMPONENT_TYPE + 'Roam', 437 | event: COMPONENT_TYPE + 'Roam', 438 | update: 'updateLayout' 439 | }, function (payload, ecModel) { 440 | ecModel.eachComponent(COMPONENT_TYPE, function (gmapModel) { 441 | var gmap = gmapModel.getGoogleMap(); 442 | var center = gmap.getCenter(); 443 | gmapModel.setCenterAndZoom([center.lng(), center.lat()], gmap.getZoom()); 444 | }); 445 | }); 446 | } 447 | 448 | isNewEC ? echarts.use(install) : install(echarts); 449 | 450 | exports.name = name; 451 | exports.version = version; 452 | 453 | })); 454 | //# sourceMappingURL=echarts-extension-gmap.js.map 455 | -------------------------------------------------------------------------------- /dist/echarts-extension-gmap.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"echarts-extension-gmap.js","sources":["../src/helper.js","../src/GMapCoordSys.js","../src/GMapModel.js","../src/GMapView.js","../src/index.js","../index.js"],"sourcesContent":["import { version } from 'echarts/lib/echarts'\n\nexport const ecVer = version.split('.')\n\nexport const isNewEC = ecVer[0] > 4\n\nexport const COMPONENT_TYPE = 'gmap'\n\nexport function v2Equal(a, b) {\n return a && b && a[0] === b[0] && a[1] === b[1]\n}\n","/* global google */\n\nimport { util as zrUtil, graphic, matrix } from 'echarts/lib/echarts'\nimport { COMPONENT_TYPE } from './helper'\n\nfunction dataToCoordSize(dataSize, dataItem) {\n dataItem = dataItem || [0, 0]\n return zrUtil.map(\n [0, 1],\n function(dimIdx) {\n const val = dataItem[dimIdx]\n const halfSize = dataSize[dimIdx] / 2\n const p1 = []\n const p2 = []\n p1[dimIdx] = val - halfSize\n p2[dimIdx] = val + halfSize\n p1[1 - dimIdx] = p2[1 - dimIdx] = dataItem[1 - dimIdx]\n return Math.abs(\n this.dataToPoint(p1)[dimIdx] - this.dataToPoint(p2)[dimIdx]\n )\n },\n this\n )\n}\n\nfunction GMapCoordSys(gmap, api) {\n this._gmap = gmap\n this.dimensions = ['lng', 'lat']\n this._mapOffset = [0, 0]\n this._api = api\n}\n\nconst GMapCoordSysProto = GMapCoordSys.prototype\n\n// exclude private and unsupported options\nconst excludedOptions = [\n 'echartsLayerZIndex',\n 'renderOnMoving'\n]\n\nGMapCoordSysProto.setZoom = function(zoom) {\n this._zoom = zoom\n}\n\nGMapCoordSysProto.setCenter = function(center) {\n const latlng = new google.maps.LatLng(center[1], center[0])\n this._center = latLngToPixel(latlng, this._gmap)\n}\n\nGMapCoordSysProto.setMapOffset = function(mapOffset) {\n this._mapOffset = mapOffset\n}\n\nGMapCoordSysProto.setGoogleMap = function(gmap) {\n this._gmap = gmap\n}\n\nGMapCoordSysProto.getGoogleMap = function() {\n return this._gmap\n}\n\nGMapCoordSysProto.dataToPoint = function(data) {\n const latlng = new google.maps.LatLng(data[1], data[0])\n const px = latLngToPixel(latlng, this._gmap)\n const mapOffset = this._mapOffset\n return [px.x - mapOffset[0], px.y - mapOffset[1]]\n}\n\nGMapCoordSysProto.pointToData = function(pt) {\n const mapOffset = this._mapOffset\n const latlng = pixelToLatLng(\n new google.maps.Point(pt[0] + mapOffset[0], pt[1] + mapOffset[1]),\n this._gmap\n )\n return [latlng.lng(), latlng.lat()]\n}\n\nGMapCoordSysProto.getViewRect = function() {\n const api = this._api\n return new graphic.BoundingRect(0, 0, api.getWidth(), api.getHeight())\n}\n\nGMapCoordSysProto.getRoamTransform = function() {\n return matrix.create()\n}\n\nGMapCoordSysProto.prepareCustoms = function() {\n const rect = this.getViewRect()\n return {\n coordSys: {\n type: COMPONENT_TYPE,\n x: rect.x,\n y: rect.y,\n width: rect.width,\n height: rect.height\n },\n api: {\n coord: zrUtil.bind(this.dataToPoint, this),\n size: zrUtil.bind(dataToCoordSize, this)\n }\n }\n}\n\nGMapCoordSysProto.convertToPixel = function(ecModel, finder, value) {\n // here we don't use finder as only one google map component is allowed\n return this.dataToPoint(value);\n}\n\nGMapCoordSysProto.convertFromPixel = function(ecModel, finder, value) {\n // here we don't use finder as only one google map component is allowed\n return this.pointToData(value);\n}\n\nGMapCoordSys.create = function(ecModel, api) {\n let gmapCoordSys\n const root = api.getDom()\n\n ecModel.eachComponent(COMPONENT_TYPE, function(gmapModel) {\n const painter = api.getZr().painter\n const viewportRoot = painter.getViewportRoot()\n if (typeof google === 'undefined' || !google.maps || !google.maps.Map) {\n throw new Error('Google Map API is not loaded')\n }\n Overlay = Overlay || createOverlayCtor()\n if (gmapCoordSys) {\n throw new Error('Only one google map component is allowed')\n }\n let gmap = gmapModel.getGoogleMap()\n if (!gmap) {\n // Not support IE8\n const className = 'ec-extension-google-map'\n let gmapRoot = root.querySelector('.' + className)\n if (gmapRoot) {\n // Reset viewport left and top, which will be changed\n // in moving handler in GMapView\n viewportRoot.style.left = '0'\n viewportRoot.style.top = '0'\n root.removeChild(gmapRoot)\n }\n gmapRoot = document.createElement('div')\n gmapRoot.className = className\n gmapRoot.style.cssText = 'position:absolute;top:0;left:0;right:0;bottom:0'\n root.appendChild(gmapRoot)\n\n const options = zrUtil.clone(gmapModel.get())\n const echartsLayerZIndex = options.echartsLayerZIndex\n // delete excluded options\n zrUtil.each(excludedOptions, function(key) {\n delete options[key]\n })\n const center = options.center\n // normalize center\n if (zrUtil.isArray(center)) {\n options.center = {\n lng: center[0],\n lat: center[1]\n }\n }\n\n gmap = new google.maps.Map(gmapRoot, options)\n gmapModel.setGoogleMap(gmap)\n\n gmapModel.__projectionChangeListener && gmapModel.__projectionChangeListener.remove()\n gmapModel.__projectionChangeListener = google.maps.event.addListener(gmap, 'projection_changed',\n function() {\n const layer = gmapModel.getEChartsLayer()\n layer && layer.setMap(null)\n\n const overlay = new Overlay(viewportRoot, gmap)\n overlay.setZIndex(echartsLayerZIndex)\n gmapModel.setEChartsLayer(overlay)\n }\n )\n\n // Override\n painter.getViewportRootOffset = function() {\n return { offsetLeft: 0, offsetTop: 0 }\n }\n }\n\n const center = gmapModel.get('center')\n const normalizedCenter = [\n center.lng != null ? center.lng : center[0],\n center.lat != null ? center.lat : center[1]\n ]\n const zoom = gmapModel.get('zoom')\n if (center && zoom) {\n const gmapCenter = gmap.getCenter()\n const gmapZoom = gmap.getZoom()\n const centerOrZoomChanged = gmapModel.centerOrZoomChanged([gmapCenter.lng(), gmapCenter.lat()], gmapZoom)\n if (centerOrZoomChanged) {\n const pt = new google.maps.LatLng(normalizedCenter[1], normalizedCenter[0])\n gmap.setOptions({\n center: pt,\n zoom: zoom\n })\n }\n }\n\n gmapCoordSys = new GMapCoordSys(gmap, api)\n gmapCoordSys.setMapOffset(gmapModel.__mapOffset || [0, 0])\n gmapCoordSys.setZoom(zoom)\n gmapCoordSys.setCenter(normalizedCenter)\n\n gmapModel.coordinateSystem = gmapCoordSys\n })\n\n ecModel.eachSeries(function(seriesModel) {\n if (seriesModel.get('coordinateSystem') === COMPONENT_TYPE) {\n seriesModel.coordinateSystem = gmapCoordSys\n }\n })\n\n // return created coordinate systems\n return gmapCoordSys && [gmapCoordSys]\n}\n\nlet Overlay\n\nfunction createOverlayCtor() {\n function Overlay(root, gmap) {\n this._root = root\n this.setMap(gmap)\n }\n\n Overlay.prototype = new google.maps.OverlayView()\n\n Overlay.prototype.onAdd = function() {\n const gmap = this.getMap()\n gmap.__overlayProjection = this.getProjection()\n gmap.getDiv().querySelector('.gm-style > div').appendChild(this._root)\n }\n\n /**\n * @override\n */\n Overlay.prototype.draw = function() {\n google.maps.event.trigger(this.getMap(), 'gmaprender')\n }\n\n Overlay.prototype.onRemove = function() {\n this._root.parentNode.removeChild(this._root)\n this._root = null\n }\n\n Overlay.prototype.setZIndex = function(zIndex) {\n this._root.style.zIndex = zIndex\n }\n\n Overlay.prototype.getZIndex = function() {\n return this._root.style.zIndex\n }\n\n return Overlay\n}\n\nfunction latLngToPixel(latLng, map) {\n const projection = map.__overlayProjection\n if (!projection) {\n return new google.maps.Point(-Infinity, -Infinity)\n }\n\n return projection.fromLatLngToContainerPixel(latLng)\n}\n\nfunction pixelToLatLng(pixel, map) {\n const projection = map.__overlayProjection\n if (!projection) {\n return new google.maps.Point(-Infinity, -Infinity)\n }\n\n return projection.fromContainerPixelToLatLng(pixel)\n}\n\nGMapCoordSysProto.dimensions = GMapCoordSys.dimensions = ['lng', 'lat']\n\nGMapCoordSysProto.type = COMPONENT_TYPE\n\nexport default GMapCoordSys\n","import { ComponentModel } from 'echarts/lib/echarts'\nimport { COMPONENT_TYPE, isNewEC, v2Equal } from './helper'\n\nconst GMapModel = {\n type: COMPONENT_TYPE,\n\n setGoogleMap(gmap) {\n this.__gmap = gmap\n },\n\n getGoogleMap() {\n // __gmap is set when creating GMapCoordSys\n return this.__gmap\n },\n\n setEChartsLayer(layer) {\n this.__echartsLayer = layer\n },\n\n getEChartsLayer() {\n return this.__echartsLayer\n },\n\n setCenterAndZoom(center, zoom) {\n this.option.center = center\n this.option.zoom = zoom\n },\n\n centerOrZoomChanged(center, zoom) {\n const option = this.option\n return !(v2Equal(center, option.center) && zoom === option.zoom)\n },\n\n defaultOption: {\n center: { lat: 39.90923, lng: 116.397428 },\n zoom: 5,\n\n // extension options\n // since v1.4.0\n roam: true,\n echartsLayerZIndex: 2000,\n renderOnMoving: true\n }\n}\n\nexport default isNewEC\n ? ComponentModel.extend(GMapModel)\n : GMapModel\n","/* global google */\n\nimport { ComponentView, getInstanceByDom, throttle } from 'echarts/lib/echarts'\nimport { isNewEC, COMPONENT_TYPE } from './helper'\n\nconst GMapView = {\n type: COMPONENT_TYPE,\n\n render(gmapModel, ecModel, api) {\n let rendering = true\n\n const gmap = gmapModel.getGoogleMap()\n const viewportRoot = api.getZr().painter.getViewportRoot()\n const coordSys = gmapModel.coordinateSystem\n const renderOnMoving = gmapModel.get('renderOnMoving')\n const offsetEl = gmap.getDiv()\n const mapEl = offsetEl.firstChild\n const oldWidth = mapEl.clientWidth\n const oldHeight = mapEl.clientHeight\n\n let renderHandler = function() {\n if (rendering) {\n return\n }\n\n // reduce unnecessary resize\n if (mapEl.clientWidth !== oldWidth || mapEl.clientHeight !== oldHeight) {\n return resizeHandler()\n }\n\n const mapOffset = [\n -parseInt(offsetEl.style.left, 10) || 0,\n -parseInt(offsetEl.style.top, 10) || 0\n ]\n viewportRoot.style.left = mapOffset[0] + 'px'\n viewportRoot.style.top = mapOffset[1] + 'px'\n\n coordSys.setMapOffset(mapOffset)\n gmapModel.__mapOffset = mapOffset\n\n api.dispatchAction({\n type: COMPONENT_TYPE + 'Roam',\n animation: {\n // in ECharts 5.x,\n // we can set animation duration as 0\n // to ensure no delay when moving or zooming\n duration: 0\n }\n })\n }\n\n let resizeHandler = function() {\n // fix chart can't get resized correctly after the google map enters fullscreen\n // See also #14\n getInstanceByDom(api.getDom()).resize({\n width: mapEl.clientWidth,\n height: mapEl.clientHeight\n })\n }\n\n this._renderHandler && this._renderHandler.remove()\n\n if (!renderOnMoving) {\n // PENDING hide layer when rendering\n renderHandler = throttle(renderHandler, 100, true)\n resizeHandler = throttle(resizeHandler, 100, true)\n }\n this._renderHandler = google.maps.event.addListener(\n gmap,\n renderOnMoving ? 'gmaprender' : 'idle',\n renderHandler\n )\n\n gmap.setOptions({\n gestureHandling: gmapModel.get('roam') ? (gmapModel.get('gestureHandling') || 'auto') : 'none'\n })\n\n rendering = false\n },\n\n dispose() {\n this._renderHandler && this._renderHandler.remove()\n delete this._renderHandler\n\n const component = this.__model\n if (!component) {\n return\n }\n\n const gmapInstance = component.getGoogleMap()\n\n if (gmapInstance) {\n // remove injected projection\n delete gmapInstance.__overlayProjection\n\n // clear all listeners of map instance\n google.maps.event.clearInstanceListeners(gmapInstance)\n\n // remove DOM of map instance\n const mapDiv = gmapInstance.getDiv()\n mapDiv.parentNode && mapDiv.parentNode.removeChild(mapDiv)\n }\n\n component.setGoogleMap(null)\n component.setEChartsLayer(null)\n\n if (component.coordinateSystem) {\n component.coordinateSystem.setGoogleMap(null)\n component.coordinateSystem = null\n }\n }\n}\n\nexport default isNewEC\n ? ComponentView.extend(GMapView)\n : GMapView\n","/**\n * Google Map component extension\n */\n\nimport GMapCoordSys from './GMapCoordSys'\nimport GMapModel from './GMapModel'\nimport GMapView from './GMapView'\nimport { isNewEC, ecVer, COMPONENT_TYPE } from './helper'\n\nexport { version, name } from '../package.json';\n\n/**\n * @typedef {import('../export').EChartsExtensionRegisters} EChartsExtensionRegisters\n */\n\n/**\n * Google Map extension installer\n * @param {EChartsExtensionRegisters} registers\n */\n export function install(registers) {\n // add coordinate system support for pie series for ECharts < 5.4.0\n if (!isNewEC || (ecVer[0] == 5 && ecVer[1] < 4)) {\n registers.registerLayout(function(ecModel) {\n ecModel.eachSeriesByType('pie', function (seriesModel) {\n const coordSys = seriesModel.coordinateSystem\n const data = seriesModel.getData()\n const valueDim = data.mapDimension('value')\n if (coordSys && coordSys.type === COMPONENT_TYPE) {\n const center = seriesModel.get('center')\n const point = coordSys.dataToPoint(center)\n const cx = point[0]\n const cy = point[1]\n data.each(valueDim, function (value, idx) {\n const layout = data.getItemLayout(idx)\n layout.cx = cx\n layout.cy = cy\n })\n }\n })\n })\n }\n // Model\n isNewEC\n ? registers.registerComponentModel(GMapModel)\n : registers.extendComponentModel(GMapModel)\n // View\n isNewEC\n ? registers.registerComponentView(GMapView)\n : registers.extendComponentView(GMapView)\n // Coordinate System\n registers.registerCoordinateSystem(COMPONENT_TYPE, GMapCoordSys)\n // Action\n registers.registerAction(\n {\n type: COMPONENT_TYPE + 'Roam',\n event: COMPONENT_TYPE + 'Roam',\n update: 'updateLayout'\n },\n function(payload, ecModel) {\n ecModel.eachComponent(COMPONENT_TYPE, function(gmapModel) {\n const gmap = gmapModel.getGoogleMap()\n const center = gmap.getCenter()\n gmapModel.setCenterAndZoom([center.lng(), center.lat()], gmap.getZoom())\n })\n }\n )\n}\n","import * as echarts from 'echarts/lib/echarts'\nimport { install } from './src/index'\nimport { isNewEC } from './src/helper'\n\nisNewEC ? echarts.use(install) : install(echarts)\n\nexport { name, version } from './src/index'\n"],"names":["ecVer","version","split","isNewEC","COMPONENT_TYPE","v2Equal","a","b","dataToCoordSize","dataSize","dataItem","zrUtil","map","dimIdx","val","halfSize","p1","p2","Math","abs","dataToPoint","GMapCoordSys","gmap","api","_gmap","dimensions","_mapOffset","_api","GMapCoordSysProto","prototype","excludedOptions","setZoom","zoom","_zoom","setCenter","center","latlng","google","maps","LatLng","_center","latLngToPixel","setMapOffset","mapOffset","setGoogleMap","getGoogleMap","data","px","x","y","pointToData","pt","pixelToLatLng","Point","lng","lat","getViewRect","graphic","BoundingRect","getWidth","getHeight","getRoamTransform","matrix","create","prepareCustoms","rect","coordSys","type","width","height","coord","bind","size","convertToPixel","ecModel","finder","value","convertFromPixel","gmapCoordSys","root","getDom","eachComponent","gmapModel","painter","getZr","viewportRoot","getViewportRoot","Map","Error","Overlay","createOverlayCtor","className","gmapRoot","querySelector","style","left","top","removeChild","document","createElement","cssText","appendChild","options","clone","get","echartsLayerZIndex","each","key","isArray","__projectionChangeListener","remove","event","addListener","layer","getEChartsLayer","setMap","overlay","setZIndex","setEChartsLayer","getViewportRootOffset","offsetLeft","offsetTop","normalizedCenter","gmapCenter","getCenter","gmapZoom","getZoom","centerOrZoomChanged","setOptions","__mapOffset","coordinateSystem","eachSeries","seriesModel","_root","OverlayView","onAdd","getMap","__overlayProjection","getProjection","getDiv","draw","trigger","onRemove","parentNode","zIndex","getZIndex","latLng","projection","Infinity","fromLatLngToContainerPixel","pixel","fromContainerPixelToLatLng","GMapModel","__gmap","__echartsLayer","setCenterAndZoom","option","defaultOption","roam","renderOnMoving","ComponentModel","extend","GMapView","render","rendering","offsetEl","mapEl","firstChild","oldWidth","clientWidth","oldHeight","clientHeight","renderHandler","resizeHandler","parseInt","dispatchAction","animation","duration","getInstanceByDom","resize","_renderHandler","throttle","gestureHandling","dispose","component","__model","gmapInstance","clearInstanceListeners","mapDiv","ComponentView","install","registers","registerLayout","eachSeriesByType","getData","valueDim","mapDimension","point","cx","cy","idx","layout","getItemLayout","registerComponentModel","extendComponentModel","registerComponentView","extendComponentView","registerCoordinateSystem","registerAction","update","payload","echarts","use"],"mappings":"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"} -------------------------------------------------------------------------------- /dist/echarts-extension-gmap.min.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * echarts-extension-gmap 3 | * @version 1.7.0 4 | * @author plainheart 5 | * 6 | * MIT License 7 | * 8 | * Copyright (c) 2020-2024 Zhongxiang Wang 9 | * 10 | * Permission is hereby granted, free of charge, to any person obtaining a copy 11 | * of this software and associated documentation files (the "Software"), to deal 12 | * in the Software without restriction, including without limitation the rights 13 | * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 14 | * copies of the Software, and to permit persons to whom the Software is 15 | * furnished to do so, subject to the following conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be included in all 18 | * copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 21 | * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 22 | * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 23 | * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 24 | * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 25 | * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 26 | * SOFTWARE. 27 | * 28 | */ 29 | !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("echarts/lib/echarts")):"function"==typeof define&&define.amd?define(["exports","echarts"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self).echarts=e.echarts||{},e.echarts.gmap={}),e.echarts)}(this,(function(e,t){"use strict";var o=t.version.split("."),n=o[0]>4,r="gmap";function i(e,o){return o=o||[0,0],t.util.map([0,1],(function(t){var n=o[t],r=e[t]/2,i=[],a=[];return i[t]=n-r,a[t]=n+r,i[1-t]=a[1-t]=o[1-t],Math.abs(this.dataToPoint(i)[t]-this.dataToPoint(a)[t])}),this)}function a(e,t){this._gmap=e,this.dimensions=["lng","lat"],this._mapOffset=[0,0],this._api=t}var s,g=a.prototype,l=["echartsLayerZIndex","renderOnMoving"];function p(e,t){var o=t.__overlayProjection;return o?o.fromLatLngToContainerPixel(e):new google.maps.Point(-1/0,-1/0)}g.setZoom=function(e){this._zoom=e},g.setCenter=function(e){var t=new google.maps.LatLng(e[1],e[0]);this._center=p(t,this._gmap)},g.setMapOffset=function(e){this._mapOffset=e},g.setGoogleMap=function(e){this._gmap=e},g.getGoogleMap=function(){return this._gmap},g.dataToPoint=function(e){var t=p(new google.maps.LatLng(e[1],e[0]),this._gmap),o=this._mapOffset;return[t.x-o[0],t.y-o[1]]},g.pointToData=function(e){var t=this._mapOffset,o=function(e,t){var o=t.__overlayProjection;if(!o)return new google.maps.Point(-1/0,-1/0);return o.fromContainerPixelToLatLng(e)}(new google.maps.Point(e[0]+t[0],e[1]+t[1]),this._gmap);return[o.lng(),o.lat()]},g.getViewRect=function(){var e=this._api;return new t.graphic.BoundingRect(0,0,e.getWidth(),e.getHeight())},g.getRoamTransform=function(){return t.matrix.create()},g.prepareCustoms=function(){var e=this.getViewRect();return{coordSys:{type:r,x:e.x,y:e.y,width:e.width,height:e.height},api:{coord:t.util.bind(this.dataToPoint,this),size:t.util.bind(i,this)}}},g.convertToPixel=function(e,t,o){return this.dataToPoint(o)},g.convertFromPixel=function(e,t,o){return this.pointToData(o)},a.create=function(e,o){var n,i=o.getDom();return e.eachComponent(r,(function(e){var r=o.getZr().painter,g=r.getViewportRoot();if("undefined"==typeof google||!google.maps||!google.maps.Map)throw new Error("Google Map API is not loaded");if(s=s||function(){function e(e,t){this._root=e,this.setMap(t)}return e.prototype=new google.maps.OverlayView,e.prototype.onAdd=function(){var e=this.getMap();e.__overlayProjection=this.getProjection(),e.getDiv().querySelector(".gm-style > div").appendChild(this._root)},e.prototype.draw=function(){google.maps.event.trigger(this.getMap(),"gmaprender")},e.prototype.onRemove=function(){this._root.parentNode.removeChild(this._root),this._root=null},e.prototype.setZIndex=function(e){this._root.style.zIndex=e},e.prototype.getZIndex=function(){return this._root.style.zIndex},e}(),n)throw new Error("Only one google map component is allowed");var p=e.getGoogleMap();if(!p){var c="ec-extension-google-map",d=i.querySelector("."+c);d&&(g.style.left="0",g.style.top="0",i.removeChild(d)),(d=document.createElement("div")).className=c,d.style.cssText="position:absolute;top:0;left:0;right:0;bottom:0",i.appendChild(d);var h=t.util.clone(e.get()),u=h.echartsLayerZIndex;t.util.each(l,(function(e){delete h[e]}));var f=h.center;t.util.isArray(f)&&(h.center={lng:f[0],lat:f[1]}),p=new google.maps.Map(d,h),e.setGoogleMap(p),e.__projectionChangeListener&&e.__projectionChangeListener.remove(),e.__projectionChangeListener=google.maps.event.addListener(p,"projection_changed",(function(){var t=e.getEChartsLayer();t&&t.setMap(null);var o=new s(g,p);o.setZIndex(u),e.setEChartsLayer(o)})),r.getViewportRootOffset=function(){return{offsetLeft:0,offsetTop:0}}}var m=e.get("center"),y=[null!=m.lng?m.lng:m[0],null!=m.lat?m.lat:m[1]],v=e.get("zoom");if(m&&v){var _=p.getCenter(),C=p.getZoom();if(e.centerOrZoomChanged([_.lng(),_.lat()],C)){var L=new google.maps.LatLng(y[1],y[0]);p.setOptions({center:L,zoom:v})}}(n=new a(p,o)).setMapOffset(e.__mapOffset||[0,0]),n.setZoom(v),n.setCenter(y),e.coordinateSystem=n})),e.eachSeries((function(e){e.get("coordinateSystem")===r&&(e.coordinateSystem=n)})),n&&[n]},g.dimensions=a.dimensions=["lng","lat"],g.type=r;var c={type:r,setGoogleMap:function(e){this.__gmap=e},getGoogleMap:function(){return this.__gmap},setEChartsLayer:function(e){this.__echartsLayer=e},getEChartsLayer:function(){return this.__echartsLayer},setCenterAndZoom:function(e,t){this.option.center=e,this.option.zoom=t},centerOrZoomChanged:function(e,t){var o,n,r=this.option;return n=r.center,!((o=e)&&n&&o[0]===n[0]&&o[1]===n[1]&&t===r.zoom)},defaultOption:{center:{lat:39.90923,lng:116.397428},zoom:5,roam:!0,echartsLayerZIndex:2e3,renderOnMoving:!0}},d=n?t.ComponentModel.extend(c):c,h={type:r,render:function(e,o,n){var i=!0,a=e.getGoogleMap(),s=n.getZr().painter.getViewportRoot(),g=e.coordinateSystem,l=e.get("renderOnMoving"),p=a.getDiv(),c=p.firstChild,d=c.clientWidth,h=c.clientHeight,u=function(){if(!i){if(c.clientWidth!==d||c.clientHeight!==h)return f();var t=[-parseInt(p.style.left,10)||0,-parseInt(p.style.top,10)||0];s.style.left=t[0]+"px",s.style.top=t[1]+"px",g.setMapOffset(t),e.__mapOffset=t,n.dispatchAction({type:r+"Roam",animation:{duration:0}})}},f=function(){t.getInstanceByDom(n.getDom()).resize({width:c.clientWidth,height:c.clientHeight})};this._renderHandler&&this._renderHandler.remove(),l||(u=t.throttle(u,100,!0),f=t.throttle(f,100,!0)),this._renderHandler=google.maps.event.addListener(a,l?"gmaprender":"idle",u),a.setOptions({gestureHandling:e.get("roam")?e.get("gestureHandling")||"auto":"none"}),i=!1},dispose:function(){this._renderHandler&&this._renderHandler.remove(),delete this._renderHandler;var e=this.__model;if(e){var t=e.getGoogleMap();if(t){delete t.__overlayProjection,google.maps.event.clearInstanceListeners(t);var o=t.getDiv();o.parentNode&&o.parentNode.removeChild(o)}e.setGoogleMap(null),e.setEChartsLayer(null),e.coordinateSystem&&(e.coordinateSystem.setGoogleMap(null),e.coordinateSystem=null)}}},u=n?t.ComponentView.extend(h):h;function f(e){(!n||5==o[0]&&o[1]<4)&&e.registerLayout((function(e){e.eachSeriesByType("pie",(function(e){var t=e.coordinateSystem,o=e.getData(),n=o.mapDimension("value");if(t&&t.type===r){var i=e.get("center"),a=t.dataToPoint(i),s=a[0],g=a[1];o.each(n,(function(e,t){var n=o.getItemLayout(t);n.cx=s,n.cy=g}))}}))})),n?e.registerComponentModel(d):e.extendComponentModel(d),n?e.registerComponentView(u):e.extendComponentView(u),e.registerCoordinateSystem(r,a),e.registerAction({type:r+"Roam",event:r+"Roam",update:"updateLayout"},(function(e,t){t.eachComponent(r,(function(e){var t=e.getGoogleMap(),o=t.getCenter();e.setCenterAndZoom([o.lng(),o.lat()],t.getZoom())}))}))}n?t.use(f):f(t),e.name="echarts-extension-gmap",e.version="1.7.0"})); 30 | //# sourceMappingURL=echarts-extension-gmap.min.js.map 31 | -------------------------------------------------------------------------------- /dist/echarts-extension-gmap.min.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"echarts-extension-gmap.min.js","sources":["../src/helper.js","../src/GMapCoordSys.js","../src/GMapModel.js","../src/GMapView.js","../src/index.js","../index.js"],"sourcesContent":["import { version } from 'echarts/lib/echarts'\n\nexport const ecVer = version.split('.')\n\nexport const isNewEC = ecVer[0] > 4\n\nexport const COMPONENT_TYPE = 'gmap'\n\nexport function v2Equal(a, b) {\n return a && b && a[0] === b[0] && a[1] === b[1]\n}\n","/* global google */\n\nimport { util as zrUtil, graphic, matrix } from 'echarts/lib/echarts'\nimport { COMPONENT_TYPE } from './helper'\n\nfunction dataToCoordSize(dataSize, dataItem) {\n dataItem = dataItem || [0, 0]\n return zrUtil.map(\n [0, 1],\n function(dimIdx) {\n const val = dataItem[dimIdx]\n const halfSize = dataSize[dimIdx] / 2\n const p1 = []\n const p2 = []\n p1[dimIdx] = val - halfSize\n p2[dimIdx] = val + halfSize\n p1[1 - dimIdx] = p2[1 - dimIdx] = dataItem[1 - dimIdx]\n return Math.abs(\n this.dataToPoint(p1)[dimIdx] - this.dataToPoint(p2)[dimIdx]\n )\n },\n this\n )\n}\n\nfunction GMapCoordSys(gmap, api) {\n this._gmap = gmap\n this.dimensions = ['lng', 'lat']\n this._mapOffset = [0, 0]\n this._api = api\n}\n\nconst GMapCoordSysProto = GMapCoordSys.prototype\n\n// exclude private and unsupported options\nconst excludedOptions = [\n 'echartsLayerZIndex',\n 'renderOnMoving'\n]\n\nGMapCoordSysProto.setZoom = function(zoom) {\n this._zoom = zoom\n}\n\nGMapCoordSysProto.setCenter = function(center) {\n const latlng = new google.maps.LatLng(center[1], center[0])\n this._center = latLngToPixel(latlng, this._gmap)\n}\n\nGMapCoordSysProto.setMapOffset = function(mapOffset) {\n this._mapOffset = mapOffset\n}\n\nGMapCoordSysProto.setGoogleMap = function(gmap) {\n this._gmap = gmap\n}\n\nGMapCoordSysProto.getGoogleMap = function() {\n return this._gmap\n}\n\nGMapCoordSysProto.dataToPoint = function(data) {\n const latlng = new google.maps.LatLng(data[1], data[0])\n const px = latLngToPixel(latlng, this._gmap)\n const mapOffset = this._mapOffset\n return [px.x - mapOffset[0], px.y - mapOffset[1]]\n}\n\nGMapCoordSysProto.pointToData = function(pt) {\n const mapOffset = this._mapOffset\n const latlng = pixelToLatLng(\n new google.maps.Point(pt[0] + mapOffset[0], pt[1] + mapOffset[1]),\n this._gmap\n )\n return [latlng.lng(), latlng.lat()]\n}\n\nGMapCoordSysProto.getViewRect = function() {\n const api = this._api\n return new graphic.BoundingRect(0, 0, api.getWidth(), api.getHeight())\n}\n\nGMapCoordSysProto.getRoamTransform = function() {\n return matrix.create()\n}\n\nGMapCoordSysProto.prepareCustoms = function() {\n const rect = this.getViewRect()\n return {\n coordSys: {\n type: COMPONENT_TYPE,\n x: rect.x,\n y: rect.y,\n width: rect.width,\n height: rect.height\n },\n api: {\n coord: zrUtil.bind(this.dataToPoint, this),\n size: zrUtil.bind(dataToCoordSize, this)\n }\n }\n}\n\nGMapCoordSysProto.convertToPixel = function(ecModel, finder, value) {\n // here we don't use finder as only one google map component is allowed\n return this.dataToPoint(value);\n}\n\nGMapCoordSysProto.convertFromPixel = function(ecModel, finder, value) {\n // here we don't use finder as only one google map component is allowed\n return this.pointToData(value);\n}\n\nGMapCoordSys.create = function(ecModel, api) {\n let gmapCoordSys\n const root = api.getDom()\n\n ecModel.eachComponent(COMPONENT_TYPE, function(gmapModel) {\n const painter = api.getZr().painter\n const viewportRoot = painter.getViewportRoot()\n if (typeof google === 'undefined' || !google.maps || !google.maps.Map) {\n throw new Error('Google Map API is not loaded')\n }\n Overlay = Overlay || createOverlayCtor()\n if (gmapCoordSys) {\n throw new Error('Only one google map component is allowed')\n }\n let gmap = gmapModel.getGoogleMap()\n if (!gmap) {\n // Not support IE8\n const className = 'ec-extension-google-map'\n let gmapRoot = root.querySelector('.' + className)\n if (gmapRoot) {\n // Reset viewport left and top, which will be changed\n // in moving handler in GMapView\n viewportRoot.style.left = '0'\n viewportRoot.style.top = '0'\n root.removeChild(gmapRoot)\n }\n gmapRoot = document.createElement('div')\n gmapRoot.className = className\n gmapRoot.style.cssText = 'position:absolute;top:0;left:0;right:0;bottom:0'\n root.appendChild(gmapRoot)\n\n const options = zrUtil.clone(gmapModel.get())\n const echartsLayerZIndex = options.echartsLayerZIndex\n // delete excluded options\n zrUtil.each(excludedOptions, function(key) {\n delete options[key]\n })\n const center = options.center\n // normalize center\n if (zrUtil.isArray(center)) {\n options.center = {\n lng: center[0],\n lat: center[1]\n }\n }\n\n gmap = new google.maps.Map(gmapRoot, options)\n gmapModel.setGoogleMap(gmap)\n\n gmapModel.__projectionChangeListener && gmapModel.__projectionChangeListener.remove()\n gmapModel.__projectionChangeListener = google.maps.event.addListener(gmap, 'projection_changed',\n function() {\n const layer = gmapModel.getEChartsLayer()\n layer && layer.setMap(null)\n\n const overlay = new Overlay(viewportRoot, gmap)\n overlay.setZIndex(echartsLayerZIndex)\n gmapModel.setEChartsLayer(overlay)\n }\n )\n\n // Override\n painter.getViewportRootOffset = function() {\n return { offsetLeft: 0, offsetTop: 0 }\n }\n }\n\n const center = gmapModel.get('center')\n const normalizedCenter = [\n center.lng != null ? center.lng : center[0],\n center.lat != null ? center.lat : center[1]\n ]\n const zoom = gmapModel.get('zoom')\n if (center && zoom) {\n const gmapCenter = gmap.getCenter()\n const gmapZoom = gmap.getZoom()\n const centerOrZoomChanged = gmapModel.centerOrZoomChanged([gmapCenter.lng(), gmapCenter.lat()], gmapZoom)\n if (centerOrZoomChanged) {\n const pt = new google.maps.LatLng(normalizedCenter[1], normalizedCenter[0])\n gmap.setOptions({\n center: pt,\n zoom: zoom\n })\n }\n }\n\n gmapCoordSys = new GMapCoordSys(gmap, api)\n gmapCoordSys.setMapOffset(gmapModel.__mapOffset || [0, 0])\n gmapCoordSys.setZoom(zoom)\n gmapCoordSys.setCenter(normalizedCenter)\n\n gmapModel.coordinateSystem = gmapCoordSys\n })\n\n ecModel.eachSeries(function(seriesModel) {\n if (seriesModel.get('coordinateSystem') === COMPONENT_TYPE) {\n seriesModel.coordinateSystem = gmapCoordSys\n }\n })\n\n // return created coordinate systems\n return gmapCoordSys && [gmapCoordSys]\n}\n\nlet Overlay\n\nfunction createOverlayCtor() {\n function Overlay(root, gmap) {\n this._root = root\n this.setMap(gmap)\n }\n\n Overlay.prototype = new google.maps.OverlayView()\n\n Overlay.prototype.onAdd = function() {\n const gmap = this.getMap()\n gmap.__overlayProjection = this.getProjection()\n gmap.getDiv().querySelector('.gm-style > div').appendChild(this._root)\n }\n\n /**\n * @override\n */\n Overlay.prototype.draw = function() {\n google.maps.event.trigger(this.getMap(), 'gmaprender')\n }\n\n Overlay.prototype.onRemove = function() {\n this._root.parentNode.removeChild(this._root)\n this._root = null\n }\n\n Overlay.prototype.setZIndex = function(zIndex) {\n this._root.style.zIndex = zIndex\n }\n\n Overlay.prototype.getZIndex = function() {\n return this._root.style.zIndex\n }\n\n return Overlay\n}\n\nfunction latLngToPixel(latLng, map) {\n const projection = map.__overlayProjection\n if (!projection) {\n return new google.maps.Point(-Infinity, -Infinity)\n }\n\n return projection.fromLatLngToContainerPixel(latLng)\n}\n\nfunction pixelToLatLng(pixel, map) {\n const projection = map.__overlayProjection\n if (!projection) {\n return new google.maps.Point(-Infinity, -Infinity)\n }\n\n return projection.fromContainerPixelToLatLng(pixel)\n}\n\nGMapCoordSysProto.dimensions = GMapCoordSys.dimensions = ['lng', 'lat']\n\nGMapCoordSysProto.type = COMPONENT_TYPE\n\nexport default GMapCoordSys\n","import { ComponentModel } from 'echarts/lib/echarts'\nimport { COMPONENT_TYPE, isNewEC, v2Equal } from './helper'\n\nconst GMapModel = {\n type: COMPONENT_TYPE,\n\n setGoogleMap(gmap) {\n this.__gmap = gmap\n },\n\n getGoogleMap() {\n // __gmap is set when creating GMapCoordSys\n return this.__gmap\n },\n\n setEChartsLayer(layer) {\n this.__echartsLayer = layer\n },\n\n getEChartsLayer() {\n return this.__echartsLayer\n },\n\n setCenterAndZoom(center, zoom) {\n this.option.center = center\n this.option.zoom = zoom\n },\n\n centerOrZoomChanged(center, zoom) {\n const option = this.option\n return !(v2Equal(center, option.center) && zoom === option.zoom)\n },\n\n defaultOption: {\n center: { lat: 39.90923, lng: 116.397428 },\n zoom: 5,\n\n // extension options\n // since v1.4.0\n roam: true,\n echartsLayerZIndex: 2000,\n renderOnMoving: true\n }\n}\n\nexport default isNewEC\n ? ComponentModel.extend(GMapModel)\n : GMapModel\n","/* global google */\n\nimport { ComponentView, getInstanceByDom, throttle } from 'echarts/lib/echarts'\nimport { isNewEC, COMPONENT_TYPE } from './helper'\n\nconst GMapView = {\n type: COMPONENT_TYPE,\n\n render(gmapModel, ecModel, api) {\n let rendering = true\n\n const gmap = gmapModel.getGoogleMap()\n const viewportRoot = api.getZr().painter.getViewportRoot()\n const coordSys = gmapModel.coordinateSystem\n const renderOnMoving = gmapModel.get('renderOnMoving')\n const offsetEl = gmap.getDiv()\n const mapEl = offsetEl.firstChild\n const oldWidth = mapEl.clientWidth\n const oldHeight = mapEl.clientHeight\n\n let renderHandler = function() {\n if (rendering) {\n return\n }\n\n // reduce unnecessary resize\n if (mapEl.clientWidth !== oldWidth || mapEl.clientHeight !== oldHeight) {\n return resizeHandler()\n }\n\n const mapOffset = [\n -parseInt(offsetEl.style.left, 10) || 0,\n -parseInt(offsetEl.style.top, 10) || 0\n ]\n viewportRoot.style.left = mapOffset[0] + 'px'\n viewportRoot.style.top = mapOffset[1] + 'px'\n\n coordSys.setMapOffset(mapOffset)\n gmapModel.__mapOffset = mapOffset\n\n api.dispatchAction({\n type: COMPONENT_TYPE + 'Roam',\n animation: {\n // in ECharts 5.x,\n // we can set animation duration as 0\n // to ensure no delay when moving or zooming\n duration: 0\n }\n })\n }\n\n let resizeHandler = function() {\n // fix chart can't get resized correctly after the google map enters fullscreen\n // See also #14\n getInstanceByDom(api.getDom()).resize({\n width: mapEl.clientWidth,\n height: mapEl.clientHeight\n })\n }\n\n this._renderHandler && this._renderHandler.remove()\n\n if (!renderOnMoving) {\n // PENDING hide layer when rendering\n renderHandler = throttle(renderHandler, 100, true)\n resizeHandler = throttle(resizeHandler, 100, true)\n }\n this._renderHandler = google.maps.event.addListener(\n gmap,\n renderOnMoving ? 'gmaprender' : 'idle',\n renderHandler\n )\n\n gmap.setOptions({\n gestureHandling: gmapModel.get('roam') ? (gmapModel.get('gestureHandling') || 'auto') : 'none'\n })\n\n rendering = false\n },\n\n dispose() {\n this._renderHandler && this._renderHandler.remove()\n delete this._renderHandler\n\n const component = this.__model\n if (!component) {\n return\n }\n\n const gmapInstance = component.getGoogleMap()\n\n if (gmapInstance) {\n // remove injected projection\n delete gmapInstance.__overlayProjection\n\n // clear all listeners of map instance\n google.maps.event.clearInstanceListeners(gmapInstance)\n\n // remove DOM of map instance\n const mapDiv = gmapInstance.getDiv()\n mapDiv.parentNode && mapDiv.parentNode.removeChild(mapDiv)\n }\n\n component.setGoogleMap(null)\n component.setEChartsLayer(null)\n\n if (component.coordinateSystem) {\n component.coordinateSystem.setGoogleMap(null)\n component.coordinateSystem = null\n }\n }\n}\n\nexport default isNewEC\n ? ComponentView.extend(GMapView)\n : GMapView\n","/**\n * Google Map component extension\n */\n\nimport GMapCoordSys from './GMapCoordSys'\nimport GMapModel from './GMapModel'\nimport GMapView from './GMapView'\nimport { isNewEC, ecVer, COMPONENT_TYPE } from './helper'\n\nexport { version, name } from '../package.json';\n\n/**\n * @typedef {import('../export').EChartsExtensionRegisters} EChartsExtensionRegisters\n */\n\n/**\n * Google Map extension installer\n * @param {EChartsExtensionRegisters} registers\n */\n export function install(registers) {\n // add coordinate system support for pie series for ECharts < 5.4.0\n if (!isNewEC || (ecVer[0] == 5 && ecVer[1] < 4)) {\n registers.registerLayout(function(ecModel) {\n ecModel.eachSeriesByType('pie', function (seriesModel) {\n const coordSys = seriesModel.coordinateSystem\n const data = seriesModel.getData()\n const valueDim = data.mapDimension('value')\n if (coordSys && coordSys.type === COMPONENT_TYPE) {\n const center = seriesModel.get('center')\n const point = coordSys.dataToPoint(center)\n const cx = point[0]\n const cy = point[1]\n data.each(valueDim, function (value, idx) {\n const layout = data.getItemLayout(idx)\n layout.cx = cx\n layout.cy = cy\n })\n }\n })\n })\n }\n // Model\n isNewEC\n ? registers.registerComponentModel(GMapModel)\n : registers.extendComponentModel(GMapModel)\n // View\n isNewEC\n ? registers.registerComponentView(GMapView)\n : registers.extendComponentView(GMapView)\n // Coordinate System\n registers.registerCoordinateSystem(COMPONENT_TYPE, GMapCoordSys)\n // Action\n registers.registerAction(\n {\n type: COMPONENT_TYPE + 'Roam',\n event: COMPONENT_TYPE + 'Roam',\n update: 'updateLayout'\n },\n function(payload, ecModel) {\n ecModel.eachComponent(COMPONENT_TYPE, function(gmapModel) {\n const gmap = gmapModel.getGoogleMap()\n const center = gmap.getCenter()\n gmapModel.setCenterAndZoom([center.lng(), center.lat()], gmap.getZoom())\n })\n }\n )\n}\n","import * as echarts from 'echarts/lib/echarts'\nimport { install } from './src/index'\nimport { isNewEC } from './src/helper'\n\nisNewEC ? echarts.use(install) : install(echarts)\n\nexport { name, version } from './src/index'\n"],"names":["ecVer","version","split","isNewEC","COMPONENT_TYPE","dataToCoordSize","dataSize","dataItem","zrUtil","map","dimIdx","val","halfSize","p1","p2","Math","abs","this","dataToPoint","GMapCoordSys","gmap","api","_gmap","dimensions","_mapOffset","_api","Overlay","GMapCoordSysProto","prototype","excludedOptions","latLngToPixel","latLng","projection","__overlayProjection","fromLatLngToContainerPixel","google","maps","Point","Infinity","setZoom","zoom","_zoom","setCenter","center","latlng","LatLng","_center","setMapOffset","mapOffset","setGoogleMap","getGoogleMap","data","px","x","y","pointToData","pt","pixel","fromContainerPixelToLatLng","pixelToLatLng","lng","lat","getViewRect","graphic","BoundingRect","getWidth","getHeight","getRoamTransform","matrix","create","prepareCustoms","rect","coordSys","type","width","height","coord","bind","size","util","convertToPixel","ecModel","finder","value","convertFromPixel","gmapCoordSys","root","getDom","eachComponent","gmapModel","painter","getZr","viewportRoot","getViewportRoot","Map","Error","_root","setMap","OverlayView","onAdd","getMap","getProjection","getDiv","querySelector","appendChild","draw","event","trigger","onRemove","parentNode","removeChild","setZIndex","zIndex","style","getZIndex","createOverlayCtor","className","gmapRoot","left","top","document","createElement","cssText","options","clone","get","echartsLayerZIndex","each","key","isArray","__projectionChangeListener","remove","addListener","layer","getEChartsLayer","overlay","setEChartsLayer","getViewportRootOffset","offsetLeft","offsetTop","normalizedCenter","gmapCenter","getCenter","gmapZoom","getZoom","centerOrZoomChanged","setOptions","__mapOffset","coordinateSystem","eachSeries","seriesModel","GMapModel","__gmap","__echartsLayer","setCenterAndZoom","option","a","b","defaultOption","roam","renderOnMoving","ComponentModel","extend","GMapView","render","rendering","offsetEl","mapEl","firstChild","oldWidth","clientWidth","oldHeight","clientHeight","renderHandler","resizeHandler","parseInt","dispatchAction","animation","duration","getInstanceByDom","resize","_renderHandler","throttle","gestureHandling","dispose","component","__model","gmapInstance","clearInstanceListeners","mapDiv","ComponentView","install","registers","registerLayout","eachSeriesByType","getData","valueDim","mapDimension","point","cx","cy","idx","layout","getItemLayout","registerComponentModel","extendComponentModel","registerComponentView","extendComponentView","registerCoordinateSystem","registerAction","update","payload","echarts","use"],"mappings":"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"} -------------------------------------------------------------------------------- /examples/heatmap.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | an example for echarts-extension-gmap 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 29 | 30 | 31 |
32 | 33 | 106 | 107 | 108 | -------------------------------------------------------------------------------- /examples/heatmap_zh_CN.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | echarts-extension-gmap heatmap 热力图示例 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 29 | 30 | 31 |
32 | 33 | 100 | 101 | 102 | -------------------------------------------------------------------------------- /examples/lines.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | an example for echarts-extension-gmap 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 29 | 30 | 31 |
32 | 33 | 126 | 127 | 128 | -------------------------------------------------------------------------------- /examples/lines_zh_CN.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | echarts-extension-gmap lines 线图示例 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 29 | 30 | 31 |
32 | 33 | 121 | 122 | 123 | -------------------------------------------------------------------------------- /examples/pie.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | pie - echarts-extension-gmap 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 28 | 29 | 30 |
31 | 32 | 120 | 121 | 122 | -------------------------------------------------------------------------------- /examples/pie_zh_CN.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | echarts-extension-gmap pie 饼图示例 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 28 | 29 | 30 |
31 | 32 | 116 | 117 | 118 | -------------------------------------------------------------------------------- /examples/scatter.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | scatter - echarts-extension-gmap 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 28 | 29 | 30 |
31 | 32 | 535 | 536 | 537 | -------------------------------------------------------------------------------- /examples/scatter_zh_CN.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | echarts-extension-gmap scatter 散点图示例 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 28 | 29 | 30 |
31 | 32 | 531 | 532 | 533 | -------------------------------------------------------------------------------- /export.d.ts: -------------------------------------------------------------------------------- 1 | import { use } from 'echarts/core' 2 | import EChartsV4 from 'echarts/lib/echarts' 3 | 4 | type UnionToIntersection = 5 | (U extends any ? (k: U) => void : never) extends ((k: infer I) => void) ? I : never 6 | 7 | type LastOf = 8 | UnionToIntersection T : never> extends () => (infer R) ? R : never 9 | 10 | type Push = [...T, V] 11 | 12 | type TuplifyUnion, N = [T] extends [never] ? true : false> = 13 | true extends N ? [] : Push>, L> 14 | 15 | type EChartsExtensionInstallRegisters = Parameters[0]>[0]>[0] 16 | 17 | export type EChartsExtensionRegisters = EChartsExtensionInstallRegisters extends never 18 | ? typeof EChartsV4 19 | : EChartsExtensionInstallRegisters 20 | 21 | /** 22 | * To install Google Map component 23 | * @param registers echarts registers. If using v4, it should be echarts namespace. 24 | */ 25 | export declare function install(registers: EChartsExtensionRegisters): void 26 | 27 | export * from './types' 28 | -------------------------------------------------------------------------------- /export.js: -------------------------------------------------------------------------------- 1 | export * from './src/index' 2 | -------------------------------------------------------------------------------- /index.d.ts: -------------------------------------------------------------------------------- 1 | export * from './types' 2 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | import * as echarts from 'echarts/lib/echarts' 2 | import { install } from './src/index' 3 | import { isNewEC } from './src/helper' 4 | 5 | isNewEC ? echarts.use(install) : install(echarts) 6 | 7 | export { name, version } from './src/index' 8 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "echarts-extension-gmap", 3 | "version": "1.7.0", 4 | "description": "A Google Map(https://www.google.com/maps) extension for Apache ECharts (https://github.com/apache/echarts)", 5 | "main": "dist/echarts-extension-gmap.min.js", 6 | "module": "dist/echarts-extension-gmap.esm.js", 7 | "files": [ 8 | "dist", 9 | "src", 10 | "index.js", 11 | "index.d.ts", 12 | "export.js", 13 | "export.d.ts", 14 | "types.d.ts", 15 | "examples/*.html" 16 | ], 17 | "types": "types.d.ts", 18 | "scripts": { 19 | "dev": "rollup -wc --environment NODE_ENV:development --bundleConfigAsCjs", 20 | "build": "rollup -c --environment NODE_ENV:production --bundleConfigAsCjs", 21 | "postbuild": "node build/post-build.js", 22 | "release": "npm run build && npm run generate:example", 23 | "generate:example": "node build/generateExamples.js" 24 | }, 25 | "repository": { 26 | "type": "git", 27 | "url": "git+https://github.com/plainheart/echarts-extension-gmap.git" 28 | }, 29 | "keywords": [ 30 | "echarts", 31 | "google-maps", 32 | "google", 33 | "echarts-extension", 34 | "data-visualization", 35 | "map", 36 | "echarts-gmap", 37 | "echarts-google-map", 38 | "echarts4", 39 | "echarts5", 40 | "gmap" 41 | ], 42 | "author": "plainheart", 43 | "license": "MIT", 44 | "bugs": { 45 | "url": "https://github.com/plainheart/echarts-extension-gmap/issues" 46 | }, 47 | "homepage": "https://github.com/plainheart/echarts-extension-gmap#readme", 48 | "devDependencies": { 49 | "@babel/core": "^7.25.2", 50 | "@babel/preset-env": "^7.25.4", 51 | "@rollup/plugin-babel": "^6.0.4", 52 | "@rollup/plugin-commonjs": "^26.0.1", 53 | "@rollup/plugin-json": "^6.1.0", 54 | "@rollup/plugin-node-resolve": "^15.2.3", 55 | "@rollup/plugin-terser": "^0.4.4", 56 | "chalk": "^4.1.2", 57 | "echarts": "^5.5.1", 58 | "rollup": "^4.21.3" 59 | } 60 | } 61 | -------------------------------------------------------------------------------- /rollup.config.js: -------------------------------------------------------------------------------- 1 | import path from 'node:path' 2 | import json from '@rollup/plugin-json' 3 | import commonjs from '@rollup/plugin-commonjs' 4 | import terser from '@rollup/plugin-terser' 5 | import { nodeResolve } from '@rollup/plugin-node-resolve' 6 | import { name, version } from './package.json' 7 | 8 | const resolve = p => path.resolve(__dirname, p) 9 | 10 | const outputConfigs = { 11 | esm: { 12 | file: resolve(`dist/${name}.esm.js`), 13 | format: 'es' 14 | }, 15 | cjs: { 16 | file: resolve(`dist/${name}.cjs.js`), 17 | format: 'cjs' 18 | }, 19 | umd: { 20 | file: resolve(`dist/${name}.js`), 21 | format: 'umd' 22 | } 23 | } 24 | 25 | const env = process.env.NODE_ENV 26 | const isProd = env === 'production' 27 | 28 | console.log(require('chalk').bgCyan(`🌎 Building ${version} for ${env}... `)) 29 | 30 | const packageFormats = isProd 31 | ? ['esm', 'cjs', 'umd'] 32 | : ['umd'] 33 | 34 | const packageConfigs = packageFormats.map( 35 | format => createConfig(format, outputConfigs[format]) 36 | ) 37 | 38 | if (isProd) { 39 | packageFormats.forEach(format => { 40 | // if (format === 'cjs') { 41 | // packageConfigs.push(createProductionConfig(format)) 42 | // } 43 | if (format === 'umd') { 44 | packageConfigs.push(createMinifiedConfig(format)) 45 | } 46 | }) 47 | } 48 | 49 | function createConfig(format, output, specificPlugins = []) { 50 | output.externalLiveBindings = false 51 | 52 | const isProdBuild = /\.min\.js$/.test(output.file) 53 | // const isESMBuild = format === 'esm' 54 | // const isNodeBuild = format === 'cjs' 55 | const isUMDBuild = format === 'umd' 56 | 57 | if (isUMDBuild) { 58 | output.name = 'echarts.gmap' 59 | output.sourcemap = isProd /* && isProdBuild */ 60 | } 61 | 62 | output.interop = 'esModule' 63 | 64 | const external = ['echarts/lib/echarts'] 65 | output.globals = { 66 | // For UMD `global.echarts` 67 | [external[0]]: 'echarts' 68 | } 69 | 70 | output.validate = isProd 71 | output.banner = isProd && require('./build/header').getLicense() 72 | 73 | const plugins = [] 74 | 75 | //if (isNodeBuild) { 76 | //plugins.push(require('@rollup/plugin-commonjs')()) 77 | //} 78 | 79 | if (isProd) { 80 | plugins.push( 81 | require('@rollup/plugin-babel').babel({ 82 | babelHelpers: 'bundled' 83 | }) 84 | ) 85 | } else { 86 | plugins.push({ 87 | outro() { 88 | return 'exports.bundleVersion = \'' + (+new Date()) + '\';' 89 | } 90 | }) 91 | } 92 | 93 | return { 94 | input: resolve('index.js'), 95 | external, 96 | plugins: [ 97 | json(), 98 | nodeResolve(), 99 | commonjs(), 100 | ...plugins, 101 | ...specificPlugins 102 | ], 103 | output, 104 | treeshake: { 105 | moduleSideEffects: false 106 | } 107 | } 108 | } 109 | 110 | function createProductionConfig(format) { 111 | return createConfig(format, { 112 | file: resolve(`dist/${name}.${format}.min.js`), 113 | format: outputConfigs[format].format 114 | }) 115 | } 116 | 117 | function createMinifiedConfig(format) { 118 | return createConfig( 119 | format, 120 | { 121 | file: outputConfigs[format].file.replace(/\.js$/, '.min.js'), 122 | format: outputConfigs[format].format 123 | }, 124 | [ 125 | terser({ 126 | module: /^esm/.test(format), 127 | compress: { 128 | ecma: 2015, 129 | pure_getters: true, 130 | pure_funcs: ['console.log'] 131 | }, 132 | safari10: true, 133 | ie8: false 134 | }) 135 | ] 136 | ) 137 | } 138 | 139 | export default packageConfigs 140 | -------------------------------------------------------------------------------- /src/GMapCoordSys.js: -------------------------------------------------------------------------------- 1 | /* global google */ 2 | 3 | import { util as zrUtil, graphic, matrix } from 'echarts/lib/echarts' 4 | import { COMPONENT_TYPE } from './helper' 5 | 6 | function dataToCoordSize(dataSize, dataItem) { 7 | dataItem = dataItem || [0, 0] 8 | return zrUtil.map( 9 | [0, 1], 10 | function(dimIdx) { 11 | const val = dataItem[dimIdx] 12 | const halfSize = dataSize[dimIdx] / 2 13 | const p1 = [] 14 | const p2 = [] 15 | p1[dimIdx] = val - halfSize 16 | p2[dimIdx] = val + halfSize 17 | p1[1 - dimIdx] = p2[1 - dimIdx] = dataItem[1 - dimIdx] 18 | return Math.abs( 19 | this.dataToPoint(p1)[dimIdx] - this.dataToPoint(p2)[dimIdx] 20 | ) 21 | }, 22 | this 23 | ) 24 | } 25 | 26 | function GMapCoordSys(gmap, api) { 27 | this._gmap = gmap 28 | this.dimensions = ['lng', 'lat'] 29 | this._mapOffset = [0, 0] 30 | this._api = api 31 | } 32 | 33 | const GMapCoordSysProto = GMapCoordSys.prototype 34 | 35 | // exclude private and unsupported options 36 | const excludedOptions = [ 37 | 'echartsLayerZIndex', 38 | 'renderOnMoving' 39 | ] 40 | 41 | GMapCoordSysProto.setZoom = function(zoom) { 42 | this._zoom = zoom 43 | } 44 | 45 | GMapCoordSysProto.setCenter = function(center) { 46 | const latlng = new google.maps.LatLng(center[1], center[0]) 47 | this._center = latLngToPixel(latlng, this._gmap) 48 | } 49 | 50 | GMapCoordSysProto.setMapOffset = function(mapOffset) { 51 | this._mapOffset = mapOffset 52 | } 53 | 54 | GMapCoordSysProto.setGoogleMap = function(gmap) { 55 | this._gmap = gmap 56 | } 57 | 58 | GMapCoordSysProto.getGoogleMap = function() { 59 | return this._gmap 60 | } 61 | 62 | GMapCoordSysProto.dataToPoint = function(data) { 63 | const latlng = new google.maps.LatLng(data[1], data[0]) 64 | const px = latLngToPixel(latlng, this._gmap) 65 | const mapOffset = this._mapOffset 66 | return [px.x - mapOffset[0], px.y - mapOffset[1]] 67 | } 68 | 69 | GMapCoordSysProto.pointToData = function(pt) { 70 | const mapOffset = this._mapOffset 71 | const latlng = pixelToLatLng( 72 | new google.maps.Point(pt[0] + mapOffset[0], pt[1] + mapOffset[1]), 73 | this._gmap 74 | ) 75 | return [latlng.lng(), latlng.lat()] 76 | } 77 | 78 | GMapCoordSysProto.getViewRect = function() { 79 | const api = this._api 80 | return new graphic.BoundingRect(0, 0, api.getWidth(), api.getHeight()) 81 | } 82 | 83 | GMapCoordSysProto.getRoamTransform = function() { 84 | return matrix.create() 85 | } 86 | 87 | GMapCoordSysProto.prepareCustoms = function() { 88 | const rect = this.getViewRect() 89 | return { 90 | coordSys: { 91 | type: COMPONENT_TYPE, 92 | x: rect.x, 93 | y: rect.y, 94 | width: rect.width, 95 | height: rect.height 96 | }, 97 | api: { 98 | coord: zrUtil.bind(this.dataToPoint, this), 99 | size: zrUtil.bind(dataToCoordSize, this) 100 | } 101 | } 102 | } 103 | 104 | GMapCoordSysProto.convertToPixel = function(ecModel, finder, value) { 105 | // here we don't use finder as only one google map component is allowed 106 | return this.dataToPoint(value); 107 | } 108 | 109 | GMapCoordSysProto.convertFromPixel = function(ecModel, finder, value) { 110 | // here we don't use finder as only one google map component is allowed 111 | return this.pointToData(value); 112 | } 113 | 114 | GMapCoordSys.create = function(ecModel, api) { 115 | let gmapCoordSys 116 | const root = api.getDom() 117 | 118 | ecModel.eachComponent(COMPONENT_TYPE, function(gmapModel) { 119 | const painter = api.getZr().painter 120 | const viewportRoot = painter.getViewportRoot() 121 | if (typeof google === 'undefined' || !google.maps || !google.maps.Map) { 122 | throw new Error('Google Map API is not loaded') 123 | } 124 | Overlay = Overlay || createOverlayCtor() 125 | if (gmapCoordSys) { 126 | throw new Error('Only one google map component is allowed') 127 | } 128 | let gmap = gmapModel.getGoogleMap() 129 | if (!gmap) { 130 | // Not support IE8 131 | const className = 'ec-extension-google-map' 132 | let gmapRoot = root.querySelector('.' + className) 133 | if (gmapRoot) { 134 | // Reset viewport left and top, which will be changed 135 | // in moving handler in GMapView 136 | viewportRoot.style.left = '0' 137 | viewportRoot.style.top = '0' 138 | root.removeChild(gmapRoot) 139 | } 140 | gmapRoot = document.createElement('div') 141 | gmapRoot.className = className 142 | gmapRoot.style.cssText = 'position:absolute;top:0;left:0;right:0;bottom:0' 143 | root.appendChild(gmapRoot) 144 | 145 | const options = zrUtil.clone(gmapModel.get()) 146 | const echartsLayerZIndex = options.echartsLayerZIndex 147 | // delete excluded options 148 | zrUtil.each(excludedOptions, function(key) { 149 | delete options[key] 150 | }) 151 | const center = options.center 152 | // normalize center 153 | if (zrUtil.isArray(center)) { 154 | options.center = { 155 | lng: center[0], 156 | lat: center[1] 157 | } 158 | } 159 | 160 | gmap = new google.maps.Map(gmapRoot, options) 161 | gmapModel.setGoogleMap(gmap) 162 | 163 | gmapModel.__projectionChangeListener && gmapModel.__projectionChangeListener.remove() 164 | gmapModel.__projectionChangeListener = google.maps.event.addListener(gmap, 'projection_changed', 165 | function() { 166 | const layer = gmapModel.getEChartsLayer() 167 | layer && layer.setMap(null) 168 | 169 | const overlay = new Overlay(viewportRoot, gmap) 170 | overlay.setZIndex(echartsLayerZIndex) 171 | gmapModel.setEChartsLayer(overlay) 172 | } 173 | ) 174 | 175 | // Override 176 | painter.getViewportRootOffset = function() { 177 | return { offsetLeft: 0, offsetTop: 0 } 178 | } 179 | } 180 | 181 | const center = gmapModel.get('center') 182 | const normalizedCenter = [ 183 | center.lng != null ? center.lng : center[0], 184 | center.lat != null ? center.lat : center[1] 185 | ] 186 | const zoom = gmapModel.get('zoom') 187 | if (center && zoom) { 188 | const gmapCenter = gmap.getCenter() 189 | const gmapZoom = gmap.getZoom() 190 | const centerOrZoomChanged = gmapModel.centerOrZoomChanged([gmapCenter.lng(), gmapCenter.lat()], gmapZoom) 191 | if (centerOrZoomChanged) { 192 | const pt = new google.maps.LatLng(normalizedCenter[1], normalizedCenter[0]) 193 | gmap.setOptions({ 194 | center: pt, 195 | zoom: zoom 196 | }) 197 | } 198 | } 199 | 200 | gmapCoordSys = new GMapCoordSys(gmap, api) 201 | gmapCoordSys.setMapOffset(gmapModel.__mapOffset || [0, 0]) 202 | gmapCoordSys.setZoom(zoom) 203 | gmapCoordSys.setCenter(normalizedCenter) 204 | 205 | gmapModel.coordinateSystem = gmapCoordSys 206 | }) 207 | 208 | ecModel.eachSeries(function(seriesModel) { 209 | if (seriesModel.get('coordinateSystem') === COMPONENT_TYPE) { 210 | seriesModel.coordinateSystem = gmapCoordSys 211 | } 212 | }) 213 | 214 | // return created coordinate systems 215 | return gmapCoordSys && [gmapCoordSys] 216 | } 217 | 218 | let Overlay 219 | 220 | function createOverlayCtor() { 221 | function Overlay(root, gmap) { 222 | this._root = root 223 | this.setMap(gmap) 224 | } 225 | 226 | Overlay.prototype = new google.maps.OverlayView() 227 | 228 | Overlay.prototype.onAdd = function() { 229 | const gmap = this.getMap() 230 | gmap.__overlayProjection = this.getProjection() 231 | gmap.getDiv().querySelector('.gm-style > div').appendChild(this._root) 232 | } 233 | 234 | /** 235 | * @override 236 | */ 237 | Overlay.prototype.draw = function() { 238 | google.maps.event.trigger(this.getMap(), 'gmaprender') 239 | } 240 | 241 | Overlay.prototype.onRemove = function() { 242 | this._root.parentNode.removeChild(this._root) 243 | this._root = null 244 | } 245 | 246 | Overlay.prototype.setZIndex = function(zIndex) { 247 | this._root.style.zIndex = zIndex 248 | } 249 | 250 | Overlay.prototype.getZIndex = function() { 251 | return this._root.style.zIndex 252 | } 253 | 254 | return Overlay 255 | } 256 | 257 | function latLngToPixel(latLng, map) { 258 | const projection = map.__overlayProjection 259 | if (!projection) { 260 | return new google.maps.Point(-Infinity, -Infinity) 261 | } 262 | 263 | return projection.fromLatLngToContainerPixel(latLng) 264 | } 265 | 266 | function pixelToLatLng(pixel, map) { 267 | const projection = map.__overlayProjection 268 | if (!projection) { 269 | return new google.maps.Point(-Infinity, -Infinity) 270 | } 271 | 272 | return projection.fromContainerPixelToLatLng(pixel) 273 | } 274 | 275 | GMapCoordSysProto.dimensions = GMapCoordSys.dimensions = ['lng', 'lat'] 276 | 277 | GMapCoordSysProto.type = COMPONENT_TYPE 278 | 279 | export default GMapCoordSys 280 | -------------------------------------------------------------------------------- /src/GMapModel.js: -------------------------------------------------------------------------------- 1 | import { ComponentModel } from 'echarts/lib/echarts' 2 | import { COMPONENT_TYPE, isNewEC, v2Equal } from './helper' 3 | 4 | const GMapModel = { 5 | type: COMPONENT_TYPE, 6 | 7 | setGoogleMap(gmap) { 8 | this.__gmap = gmap 9 | }, 10 | 11 | getGoogleMap() { 12 | // __gmap is set when creating GMapCoordSys 13 | return this.__gmap 14 | }, 15 | 16 | setEChartsLayer(layer) { 17 | this.__echartsLayer = layer 18 | }, 19 | 20 | getEChartsLayer() { 21 | return this.__echartsLayer 22 | }, 23 | 24 | setCenterAndZoom(center, zoom) { 25 | this.option.center = center 26 | this.option.zoom = zoom 27 | }, 28 | 29 | centerOrZoomChanged(center, zoom) { 30 | const option = this.option 31 | return !(v2Equal(center, option.center) && zoom === option.zoom) 32 | }, 33 | 34 | defaultOption: { 35 | center: { lat: 39.90923, lng: 116.397428 }, 36 | zoom: 5, 37 | 38 | // extension options 39 | // since v1.4.0 40 | roam: true, 41 | echartsLayerZIndex: 2000, 42 | renderOnMoving: true 43 | } 44 | } 45 | 46 | export default isNewEC 47 | ? ComponentModel.extend(GMapModel) 48 | : GMapModel 49 | -------------------------------------------------------------------------------- /src/GMapView.js: -------------------------------------------------------------------------------- 1 | /* global google */ 2 | 3 | import { ComponentView, getInstanceByDom, throttle } from 'echarts/lib/echarts' 4 | import { isNewEC, COMPONENT_TYPE } from './helper' 5 | 6 | const GMapView = { 7 | type: COMPONENT_TYPE, 8 | 9 | render(gmapModel, ecModel, api) { 10 | let rendering = true 11 | 12 | const gmap = gmapModel.getGoogleMap() 13 | const viewportRoot = api.getZr().painter.getViewportRoot() 14 | const coordSys = gmapModel.coordinateSystem 15 | const renderOnMoving = gmapModel.get('renderOnMoving') 16 | const offsetEl = gmap.getDiv() 17 | const mapEl = offsetEl.firstChild 18 | const oldWidth = mapEl.clientWidth 19 | const oldHeight = mapEl.clientHeight 20 | 21 | let renderHandler = function() { 22 | if (rendering) { 23 | return 24 | } 25 | 26 | // reduce unnecessary resize 27 | if (mapEl.clientWidth !== oldWidth || mapEl.clientHeight !== oldHeight) { 28 | return resizeHandler() 29 | } 30 | 31 | const mapOffset = [ 32 | -parseInt(offsetEl.style.left, 10) || 0, 33 | -parseInt(offsetEl.style.top, 10) || 0 34 | ] 35 | viewportRoot.style.left = mapOffset[0] + 'px' 36 | viewportRoot.style.top = mapOffset[1] + 'px' 37 | 38 | coordSys.setMapOffset(mapOffset) 39 | gmapModel.__mapOffset = mapOffset 40 | 41 | api.dispatchAction({ 42 | type: COMPONENT_TYPE + 'Roam', 43 | animation: { 44 | // in ECharts 5.x, 45 | // we can set animation duration as 0 46 | // to ensure no delay when moving or zooming 47 | duration: 0 48 | } 49 | }) 50 | } 51 | 52 | let resizeHandler = function() { 53 | // fix chart can't get resized correctly after the google map enters fullscreen 54 | // See also #14 55 | getInstanceByDom(api.getDom()).resize({ 56 | width: mapEl.clientWidth, 57 | height: mapEl.clientHeight 58 | }) 59 | } 60 | 61 | this._renderHandler && this._renderHandler.remove() 62 | 63 | if (!renderOnMoving) { 64 | // PENDING hide layer when rendering 65 | renderHandler = throttle(renderHandler, 100, true) 66 | resizeHandler = throttle(resizeHandler, 100, true) 67 | } 68 | this._renderHandler = google.maps.event.addListener( 69 | gmap, 70 | renderOnMoving ? 'gmaprender' : 'idle', 71 | renderHandler 72 | ) 73 | 74 | gmap.setOptions({ 75 | gestureHandling: gmapModel.get('roam') ? (gmapModel.get('gestureHandling') || 'auto') : 'none' 76 | }) 77 | 78 | rendering = false 79 | }, 80 | 81 | dispose() { 82 | this._renderHandler && this._renderHandler.remove() 83 | delete this._renderHandler 84 | 85 | const component = this.__model 86 | if (!component) { 87 | return 88 | } 89 | 90 | const gmapInstance = component.getGoogleMap() 91 | 92 | if (gmapInstance) { 93 | // remove injected projection 94 | delete gmapInstance.__overlayProjection 95 | 96 | // clear all listeners of map instance 97 | google.maps.event.clearInstanceListeners(gmapInstance) 98 | 99 | // remove DOM of map instance 100 | const mapDiv = gmapInstance.getDiv() 101 | mapDiv.parentNode && mapDiv.parentNode.removeChild(mapDiv) 102 | } 103 | 104 | component.setGoogleMap(null) 105 | component.setEChartsLayer(null) 106 | 107 | if (component.coordinateSystem) { 108 | component.coordinateSystem.setGoogleMap(null) 109 | component.coordinateSystem = null 110 | } 111 | } 112 | } 113 | 114 | export default isNewEC 115 | ? ComponentView.extend(GMapView) 116 | : GMapView 117 | -------------------------------------------------------------------------------- /src/helper.js: -------------------------------------------------------------------------------- 1 | import { version } from 'echarts/lib/echarts' 2 | 3 | export const ecVer = version.split('.') 4 | 5 | export const isNewEC = ecVer[0] > 4 6 | 7 | export const COMPONENT_TYPE = 'gmap' 8 | 9 | export function v2Equal(a, b) { 10 | return a && b && a[0] === b[0] && a[1] === b[1] 11 | } 12 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Google Map component extension 3 | */ 4 | 5 | import GMapCoordSys from './GMapCoordSys' 6 | import GMapModel from './GMapModel' 7 | import GMapView from './GMapView' 8 | import { isNewEC, ecVer, COMPONENT_TYPE } from './helper' 9 | 10 | export { version, name } from '../package.json'; 11 | 12 | /** 13 | * @typedef {import('../export').EChartsExtensionRegisters} EChartsExtensionRegisters 14 | */ 15 | 16 | /** 17 | * Google Map extension installer 18 | * @param {EChartsExtensionRegisters} registers 19 | */ 20 | export function install(registers) { 21 | // add coordinate system support for pie series for ECharts < 5.4.0 22 | if (!isNewEC || (ecVer[0] == 5 && ecVer[1] < 4)) { 23 | registers.registerLayout(function(ecModel) { 24 | ecModel.eachSeriesByType('pie', function (seriesModel) { 25 | const coordSys = seriesModel.coordinateSystem 26 | const data = seriesModel.getData() 27 | const valueDim = data.mapDimension('value') 28 | if (coordSys && coordSys.type === COMPONENT_TYPE) { 29 | const center = seriesModel.get('center') 30 | const point = coordSys.dataToPoint(center) 31 | const cx = point[0] 32 | const cy = point[1] 33 | data.each(valueDim, function (value, idx) { 34 | const layout = data.getItemLayout(idx) 35 | layout.cx = cx 36 | layout.cy = cy 37 | }) 38 | } 39 | }) 40 | }) 41 | } 42 | // Model 43 | isNewEC 44 | ? registers.registerComponentModel(GMapModel) 45 | : registers.extendComponentModel(GMapModel) 46 | // View 47 | isNewEC 48 | ? registers.registerComponentView(GMapView) 49 | : registers.extendComponentView(GMapView) 50 | // Coordinate System 51 | registers.registerCoordinateSystem(COMPONENT_TYPE, GMapCoordSys) 52 | // Action 53 | registers.registerAction( 54 | { 55 | type: COMPONENT_TYPE + 'Roam', 56 | event: COMPONENT_TYPE + 'Roam', 57 | update: 'updateLayout' 58 | }, 59 | function(payload, ecModel) { 60 | ecModel.eachComponent(COMPONENT_TYPE, function(gmapModel) { 61 | const gmap = gmapModel.getGoogleMap() 62 | const center = gmap.getCenter() 63 | gmapModel.setCenterAndZoom([center.lng(), center.lat()], gmap.getZoom()) 64 | }) 65 | } 66 | ) 67 | } 68 | -------------------------------------------------------------------------------- /types.d.ts: -------------------------------------------------------------------------------- 1 | declare const name = 'echarts-extension-gmap' 2 | declare const version = '1.7.0' 3 | 4 | interface InnerGoogleMapComponentOption { 5 | /** 6 | * The zIndex of echarts layer for Google Map. 7 | * @default 2000 8 | */ 9 | echartsLayerZIndex?: number 10 | /** 11 | * Whether echarts layer should be rendered when the map is moving. 12 | * if `false`, it will only be re-rendered after the map `moveend`. 13 | * It's better to set this option to false if data is large. 14 | * @default true 15 | */ 16 | renderOnMoving?: boolean 17 | /** 18 | * Whether to enable gesture handling. 19 | * @default true 20 | * @since v1.4.0 21 | */ 22 | roam?: boolean 23 | } 24 | 25 | /** 26 | * Extended Google Map component option 27 | */ 28 | interface GoogleMapComponentOption { 29 | gmap?: GoogleMapOption extends never 30 | ? InnerGoogleMapComponentOption 31 | : InnerGoogleMapComponentOption & GoogleMapOption 32 | } 33 | 34 | export { name, version, GoogleMapComponentOption } 35 | --------------------------------------------------------------------------------