mirror of https://gitee.com/antv-l7/antv-l7
docs: 补充官网关于简单坐标系/非地理坐标系的文档和案例
This commit is contained in:
2912401452
parent
07b605d61c
commit
afe66743c8
|
|
@ -0,0 +1,6 @@
|
||||||
|
---
|
||||||
|
title: SimpleCoordinates
|
||||||
|
order: 1
|
||||||
|
---
|
||||||
|
|
||||||
|
`markdown:docs/api/experiment/simpleCoordinates.zh.md`
|
||||||
|
|
@ -0,0 +1,178 @@
|
||||||
|
---
|
||||||
|
title: 简单坐标系（非地理坐标系）
|
||||||
|
order: 1
|
||||||
|
---
|
||||||
|
|
||||||
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
|
我们通常使用经纬度来描述地理位置，但是在某些特殊的场景，我们往往倾向于使用更加简单的平面坐标系(xyz)来描述位置的相对坐标，为此 L7 提供了简单坐标系的模式。
|
||||||
|
|
||||||
|
<img width="60%" style="display: block;margin: 0 auto;" alt="案例" src='https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*HenKR5VsXX0AAAAAAAAAAAAAARQnAQ'>
|
||||||
|
|
||||||
|
[在线案例](/zh/examples/point/text#simpleCoordinate)
|
||||||
|
|
||||||
|
### Map
|
||||||
|
为了使用简单坐标系，我们需要是使用 L7 自定义的 Map 地图类型，同时制定 map 的 version 属性
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
import { Scene, ImageLayer, PointLayer, } from '@antv/l7';
|
||||||
|
import { Map } from '@antv/l7-maps';
|
||||||
|
|
||||||
|
const scene = new Scene({
|
||||||
|
id: 'map',
|
||||||
|
map: new Map({
|
||||||
|
center: [500, 500],
|
||||||
|
pitch: 0,
|
||||||
|
zoom: 3,
|
||||||
|
version: 'SIMPLE',
|
||||||
|
mapSize: 1000,
|
||||||
|
maxZoom: 5,
|
||||||
|
minZoom: 2,
|
||||||
|
pitchEnabled: false,
|
||||||
|
rotateEnabled: false,
|
||||||
|
}),
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
#### version
|
||||||
|
用户在使用自定义坐标系的时候，需要将地图的类型设置成 'SIMPLE'
|
||||||
|
|
||||||
|
#### mapSize: number
|
||||||
|
用户在使用自定义坐标系的时候，可以设置绘图区域的大小。绘图区域默认是 10000 X 10000 的矩形区域，坐标起点是左下角，水平向右为 X 正方向，垂直向上是 Y 正方向。
|
||||||
|
|
||||||
|
<img width="50%" style="display: block;margin: 0 auto;" alt="案例" src='https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*qimkTLy0P6IAAAAAAAAAAAAAARQnAQ'>
|
||||||
|
|
||||||
|
#### pitchEnabled/rotateEnabled
|
||||||
|
用户在使用自定义坐标系的时候，推荐将 pitchEnabled/rotateEnabled 设置为 false
|
||||||
|
|
||||||
|
#### layer
|
||||||
|
用户在使用自定义坐标系的时候，可以正常使用普通的图层，唯一的区别就是需要将原本的经纬度坐标转化为平面坐标
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
const imagelayer = new ImageLayer({}).source(
|
||||||
|
'https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*I0X5R4jAUQ4AAAAAAAAAAAAAARQnAQ',
|
||||||
|
{
|
||||||
|
parser: {
|
||||||
|
type: 'image',
|
||||||
|
extent: [360, 400, 640, 600],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
const textlayer = new PointLayer({ zIndex: 2 })
|
||||||
|
.source(
|
||||||
|
[
|
||||||
|
{
|
||||||
|
x: 515,
|
||||||
|
y: 575,
|
||||||
|
t: '小屋',
|
||||||
|
},
|
||||||
|
...
|
||||||
|
],
|
||||||
|
{
|
||||||
|
parser: {
|
||||||
|
type: 'json',
|
||||||
|
x: 'x',
|
||||||
|
y: 'y',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
)
|
||||||
|
.shape('t', 'text')
|
||||||
|
.size(12)
|
||||||
|
.active({
|
||||||
|
color: '#00f',
|
||||||
|
mix: 0.9
|
||||||
|
})
|
||||||
|
.color('rgb(86, 156, 214)')
|
||||||
|
.style({
|
||||||
|
textAnchor: 'center', // 文本相对锚点的位置 center|left|right|top|bottom|top-left
|
||||||
|
spacing: 2, // 字符间距
|
||||||
|
fontWeight: '800',
|
||||||
|
padding: [1, 1], // 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
|
||||||
|
stroke: '#ffffff', // 描边颜色
|
||||||
|
strokeWidth: 2, // 描边宽度
|
||||||
|
textAllowOverlap: true,
|
||||||
|
});
|
||||||
|
|
||||||
|
const lineData = {
|
||||||
|
type: 'FeatureCollection',
|
||||||
|
features: [
|
||||||
|
{
|
||||||
|
type: 'Feature',
|
||||||
|
properties: {
|
||||||
|
testOpacity: 0.8,
|
||||||
|
},
|
||||||
|
geometry: {
|
||||||
|
type: 'Polygon',
|
||||||
|
coordinates: [
|
||||||
|
[
|
||||||
|
[6000, 6000],
|
||||||
|
[6000, 7000],
|
||||||
|
[7000, 7000],
|
||||||
|
[7000, 6000],
|
||||||
|
],
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
|
||||||
|
const linelayer = new LineLayer()
|
||||||
|
.source(lineData)
|
||||||
|
.shape('line')
|
||||||
|
.size(10)
|
||||||
|
.color('#0f0')
|
||||||
|
.active(true);
|
||||||
|
|
||||||
|
|
||||||
|
const polygonData = {
|
||||||
|
type: 'FeatureCollection',
|
||||||
|
features: [
|
||||||
|
{
|
||||||
|
type: 'Feature',
|
||||||
|
properties: {
|
||||||
|
testOpacity: 0.4,
|
||||||
|
},
|
||||||
|
geometry: {
|
||||||
|
type: 'MultiPolygon',
|
||||||
|
coordinates: [
|
||||||
|
[
|
||||||
|
[
|
||||||
|
[6000, 6000],
|
||||||
|
[6000, 7000],
|
||||||
|
[7000, 7000],
|
||||||
|
[7000, 6000],
|
||||||
|
[6000, 6000],
|
||||||
|
],
|
||||||
|
[
|
||||||
|
[6300, 6300],
|
||||||
|
[6300, 6700],
|
||||||
|
[6700, 6700],
|
||||||
|
[6700, 6300],
|
||||||
|
[6300, 6300],
|
||||||
|
],
|
||||||
|
],
|
||||||
|
[
|
||||||
|
[
|
||||||
|
[5000, 5000],
|
||||||
|
[5000, 6000],
|
||||||
|
[6000, 6000],
|
||||||
|
[6000, 5000],
|
||||||
|
[5000, 5000],
|
||||||
|
],
|
||||||
|
],
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
|
||||||
|
const polygonLayer = new PolygonLayer()
|
||||||
|
.source(polygonData)
|
||||||
|
.shape('fill')
|
||||||
|
.color('#f00')
|
||||||
|
.style({
|
||||||
|
opacity: 0.6,
|
||||||
|
})
|
||||||
|
.active(true);
|
||||||
|
```
|
||||||
|
|
@ -38,6 +38,11 @@
|
||||||
"filename": "updown.js",
|
"filename": "updown.js",
|
||||||
"title": "走势图标标注",
|
"title": "走势图标标注",
|
||||||
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*LJXlRraIokAAAAAAAAAAAAAAARQnAQ"
|
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*LJXlRraIokAAAAAAAAAAAAAAARQnAQ"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"filename": "simpleCoordinate.js",
|
||||||
|
"title": "平面区域标注",
|
||||||
|
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*OXlZRKw7AoUAAAAAAAAAAAAAARQnAQ"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,226 @@
|
||||||
|
import { Scene, ImageLayer, PointLayer, } from '@antv/l7';
|
||||||
|
import { Map } from '@antv/l7-maps';
|
||||||
|
|
||||||
|
const scene = new Scene({
|
||||||
|
id: 'map',
|
||||||
|
map: new Map({
|
||||||
|
center: [500, 500],
|
||||||
|
pitch: 0,
|
||||||
|
zoom: 3,
|
||||||
|
version: 'SIMPLE',
|
||||||
|
mapSize: 1000,
|
||||||
|
maxZoom: 5,
|
||||||
|
minZoom: 2,
|
||||||
|
pitchEnabled: false,
|
||||||
|
rotateEnabled: false,
|
||||||
|
}),
|
||||||
|
});
|
||||||
|
scene.setBgColor('rgb(94, 182, 140)');
|
||||||
|
const textlayer = new PointLayer({ zIndex: 2 })
|
||||||
|
.source(
|
||||||
|
[
|
||||||
|
{
|
||||||
|
x: 515,
|
||||||
|
y: 575,
|
||||||
|
t: '小屋',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 507,
|
||||||
|
y: 560,
|
||||||
|
t: '小屋',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 495,
|
||||||
|
y: 553,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 499,
|
||||||
|
y: 547,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 480,
|
||||||
|
y: 544,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 471,
|
||||||
|
y: 539,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 485,
|
||||||
|
y: 527,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 463,
|
||||||
|
y: 533,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 477,
|
||||||
|
y: 523,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 473,
|
||||||
|
y: 517,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 535,
|
||||||
|
y: 535,
|
||||||
|
t: '住宅小区',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 550,
|
||||||
|
y: 545,
|
||||||
|
t: '住宅小区',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 578,
|
||||||
|
y: 559,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 583,
|
||||||
|
y: 554,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 590,
|
||||||
|
y: 538,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 599,
|
||||||
|
y: 537,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 567,
|
||||||
|
y: 526,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 564,
|
||||||
|
y: 519,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 553.5,
|
||||||
|
y: 483,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 554,
|
||||||
|
y: 479,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 547,
|
||||||
|
y: 478.5,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 533.5,
|
||||||
|
y: 475,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 516,
|
||||||
|
y: 463,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 538,
|
||||||
|
y: 453,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 510.5,
|
||||||
|
y: 444,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 488,
|
||||||
|
y: 440.5,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 476.5,
|
||||||
|
y: 438.5,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 474.5,
|
||||||
|
y: 431,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 462,
|
||||||
|
y: 434.5,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 431,
|
||||||
|
y: 436,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 428,
|
||||||
|
y: 430,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 402.5,
|
||||||
|
y: 448.5,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 393.5,
|
||||||
|
y: 456,
|
||||||
|
t: '别墅',
|
||||||
|
}
|
||||||
|
],
|
||||||
|
{
|
||||||
|
parser: {
|
||||||
|
type: 'json',
|
||||||
|
x: 'x',
|
||||||
|
y: 'y',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
)
|
||||||
|
.shape('t', 'text')
|
||||||
|
.size(12)
|
||||||
|
.active({
|
||||||
|
color: '#00f',
|
||||||
|
mix: 0.9
|
||||||
|
})
|
||||||
|
.color('rgb(86, 156, 214)')
|
||||||
|
.style({
|
||||||
|
textAnchor: 'center', // 文本相对锚点的位置 center|left|right|top|bottom|top-left
|
||||||
|
spacing: 2, // 字符间距
|
||||||
|
fontWeight: '800',
|
||||||
|
padding: [1, 1], // 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
|
||||||
|
stroke: '#ffffff', // 描边颜色
|
||||||
|
strokeWidth: 2, // 描边宽度
|
||||||
|
textAllowOverlap: true,
|
||||||
|
});
|
||||||
|
|
||||||
|
const imagelayer = new ImageLayer({}).source(
|
||||||
|
'https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*I0X5R4jAUQ4AAAAAAAAAAAAAARQnAQ',
|
||||||
|
{
|
||||||
|
parser: {
|
||||||
|
type: 'image',
|
||||||
|
extent: [360, 400, 640, 600],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
scene.on('loaded', () => {
|
||||||
|
scene.addLayer(imagelayer);
|
||||||
|
scene.addLayer(textlayer);
|
||||||
|
});
|
||||||
|
|
@ -270,6 +270,14 @@ module.exports = {
|
||||||
},
|
},
|
||||||
order: 14,
|
order: 14,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
slug: 'api/experiment',
|
||||||
|
title: {
|
||||||
|
zh: '实验特性',
|
||||||
|
en: 'experiment',
|
||||||
|
},
|
||||||
|
order: 15,
|
||||||
|
},
|
||||||
],
|
],
|
||||||
examples: [
|
examples: [
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -15,10 +15,10 @@ export default class Demo extends React.Component {
|
||||||
map: new Map({
|
map: new Map({
|
||||||
center: [500, 500],
|
center: [500, 500],
|
||||||
pitch: 0,
|
pitch: 0,
|
||||||
zoom: 2.5,
|
zoom: 3,
|
||||||
version: 'SIMPLE',
|
version: 'SIMPLE',
|
||||||
mapSize: 1000,
|
mapSize: 1000,
|
||||||
maxZoom: 4,
|
maxZoom: 5,
|
||||||
minZoom: 2,
|
minZoom: 2,
|
||||||
pitchEnabled: false,
|
pitchEnabled: false,
|
||||||
rotateEnabled: false,
|
rotateEnabled: false,
|
||||||
|
|
@ -30,30 +30,170 @@ export default class Demo extends React.Component {
|
||||||
.source(
|
.source(
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
x: 470,
|
x: 515,
|
||||||
y: 520,
|
y: 575,
|
||||||
t: '库布齐',
|
t: '小屋',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
x: 490,
|
x: 507,
|
||||||
y: 580,
|
y: 560,
|
||||||
t: '阿拉善',
|
t: '小屋',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
x: 530,
|
x: 495,
|
||||||
y: 530,
|
y: 553,
|
||||||
t: '鄂尔多斯',
|
t: '别墅',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
x: 545,
|
x: 499,
|
||||||
y: 480,
|
y: 547,
|
||||||
t: '武威',
|
t: '住宅',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
x: 490,
|
x: 480,
|
||||||
y: 470,
|
y: 544,
|
||||||
t: '黄山洋湖',
|
t: '住宅',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
x: 471,
|
||||||
|
y: 539,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 485,
|
||||||
|
y: 527,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 463,
|
||||||
|
y: 533,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 477,
|
||||||
|
y: 523,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 473,
|
||||||
|
y: 517,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 535,
|
||||||
|
y: 535,
|
||||||
|
t: '住宅小区',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 550,
|
||||||
|
y: 545,
|
||||||
|
t: '住宅小区',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 578,
|
||||||
|
y: 559,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 583,
|
||||||
|
y: 554,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 590,
|
||||||
|
y: 538,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 599,
|
||||||
|
y: 537,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 567,
|
||||||
|
y: 526,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 564,
|
||||||
|
y: 519,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 553.5,
|
||||||
|
y: 483,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 554,
|
||||||
|
y: 479,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 547,
|
||||||
|
y: 478.5,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 533.5,
|
||||||
|
y: 475,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 516,
|
||||||
|
y: 463,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 538,
|
||||||
|
y: 453,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 510.5,
|
||||||
|
y: 444,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 488,
|
||||||
|
y: 440.5,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 476.5,
|
||||||
|
y: 438.5,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 474.5,
|
||||||
|
y: 431,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 462,
|
||||||
|
y: 434.5,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 431,
|
||||||
|
y: 436,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 428,
|
||||||
|
y: 430,
|
||||||
|
t: '住宅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 402.5,
|
||||||
|
y: 448.5,
|
||||||
|
t: '别墅',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
x: 393.5,
|
||||||
|
y: 456,
|
||||||
|
t: '别墅',
|
||||||
|
}
|
||||||
],
|
],
|
||||||
{
|
{
|
||||||
parser: {
|
parser: {
|
||||||
|
|
@ -64,15 +204,20 @@ export default class Demo extends React.Component {
|
||||||
},
|
},
|
||||||
)
|
)
|
||||||
.shape('t', 'text')
|
.shape('t', 'text')
|
||||||
.size(14)
|
.size(12)
|
||||||
.active(true)
|
.active({
|
||||||
.color('#0e0030')
|
color: '#00f',
|
||||||
|
mix: 0.9
|
||||||
|
})
|
||||||
|
// .color('#0e0030')
|
||||||
|
.color('rgb(86, 156, 214)')
|
||||||
.style({
|
.style({
|
||||||
textAnchor: 'center', // 文本相对锚点的位置 center|left|right|top|bottom|top-left
|
textAnchor: 'center', // 文本相对锚点的位置 center|left|right|top|bottom|top-left
|
||||||
spacing: 2, // 字符间距
|
spacing: 2, // 字符间距
|
||||||
|
fontWeight: '800',
|
||||||
padding: [1, 1], // 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
|
padding: [1, 1], // 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
|
||||||
stroke: '#ffffff', // 描边颜色
|
stroke: '#ffffff', // 描边颜色
|
||||||
strokeWidth: 1.5, // 描边宽度
|
strokeWidth: 2, // 描边宽度
|
||||||
textAllowOverlap: true,
|
textAllowOverlap: true,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue