diff --git a/demos/vector2.html b/demos/vector2.html index 81f103e6c4..30cf610b4d 100644 --- a/demos/vector2.html +++ b/demos/vector2.html @@ -37,11 +37,7 @@ const scene = new L7.Scene({ // 高德数据服务 https://mvt.amap.com/district/CHN2/{z}/{x}/{y}/4096?key=608d75903d29ad471362f8c58c550daf scene.on('loaded', () => { - const ZoomControl = new L7.Control.Zoom(); - ZoomControl.addTo(scene); - const scaleControl = new L7.Control.Scale(); - scaleControl.addTo(scene); - + const attributeCtr = new L7.Control.Attribution(); attributeCtr.addTo(scene); diff --git a/package.json b/package.json index f7cd705bc1..3be8a78d2a 100755 --- a/package.json +++ b/package.json @@ -47,6 +47,7 @@ "nunjucks": "~3.0.1", "open": "~0.0.5", "parseurl": "~1.3.2", + "postcss-url": "^8.0.0", "pre-commit": "~1.2.2", "rollup": "^1.16.2", "rollup-plugin-buble": "^0.19.6", @@ -56,6 +57,7 @@ "rollup-plugin-json": "^4.0.0", "rollup-plugin-node-builtins": "^2.1.2", "rollup-plugin-node-resolve": "^4.0.1", + "rollup-plugin-postcss": "^2.0.3", "rollup-plugin-terser": "^4.0.4", "serve-static": "^1.13.2", "shelljs": "~0.7.8", diff --git a/rollup.config.js b/rollup.config.js index 7c7db3e4a9..f0d12db60b 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -1,15 +1,12 @@ import fs from 'fs'; -// import sourcemaps from 'rollup-plugin-sourcemaps'; -// import postcss from 'postcss'; import json from 'rollup-plugin-json'; import buble from 'rollup-plugin-buble'; import resolve from 'rollup-plugin-node-resolve'; import commonjs from 'rollup-plugin-commonjs'; import builtins from 'rollup-plugin-node-builtins'; import { createFilter } from 'rollup-pluginutils'; -import imageInliner from 'postcss-image-inliner'; import postcss from 'rollup-plugin-postcss'; -import postcssImport from 'postcss-import'; +import url from 'postcss-url'; import { terser } from 'rollup-plugin-terser'; const { BUILD, MINIFY } = process.env; const minified = MINIFY === 'true'; @@ -45,11 +42,7 @@ const config = [ json(), // css({ raw: './build/l7.css' }), postcss({ - modules: true, - plugins: [ - postcssImport(), - imageInliner({ assetPaths: [ '**/images/' ] }) - ] + plugins: [ url({ url: 'inline' }) ] }), // url({ url: 'inline' }), buble({ diff --git a/src/component/css/l7.css b/src/component/css/l7.css index 98dd7b1e7d..f2de698cc0 100644 --- a/src/component/css/l7.css +++ b/src/component/css/l7.css @@ -82,6 +82,9 @@ /* control positioning */ +.l7-control-container { + font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif; +} .l7-control { position: relative; z-index: 800; @@ -197,12 +200,12 @@ border-radius: 5px; } .l7-control-layers-toggle { - background-image: url(images/layers.png); + background-image: url(../images/layers.png); width: 36px; height: 36px; } .l7-retina .l7-control-layers-toggle { - background-image: url(images/layers-2x.png); + background-image: url(../images/layers-2x.png); background-size: 26px 26px; } .l7-touch .l7-control-layers-toggle { diff --git a/src/core/scene.js b/src/core/scene.js index 1537b5dad1..e3ebb388f4 100644 --- a/src/core/scene.js +++ b/src/core/scene.js @@ -9,7 +9,8 @@ import Global from '../global'; import { getInteraction } from '../interaction/index'; import { compileBuiltinModules } from '../geom/shader'; import Style from './style'; -import Control from './controller/control'; +import Controller from './controller/control'; +import * as Control from '../component/control'; import { epsg3857 } from '@antv/geo-coord/lib/geo/crs/crs-epsg3857'; export default class Scene extends Base { getDefaultCfg() { @@ -34,8 +35,14 @@ export default class Scene extends Base { compileBuiltinModules(); } _initContoller() { - const controlCtr = new Control({ scene: this }); + const controlCtr = new Controller({ scene: this }); this.set('controlController', controlCtr); + if (this.get('zoomControl')) { + new Control.Zoom().addTo(this); + } + if (this.get('scaleControl')) { + new Control.Scale().addTo(this); + } } // 为pickup场景添加 object 对象 addPickMesh(object) { diff --git a/src/global.js b/src/global.js index 33c679ba3c..7161b52d5b 100644 --- a/src/global.js +++ b/src/global.js @@ -14,7 +14,9 @@ const Global = { minZoom: 3, maxZoom: 18, pitch: 0, - hash: false + hash: false, + zoomControl: true, + scaleControl: true }, animate: true, height: 0,