Summary of main reference materials
http://support.supermap.com.cn:8090/webgl/docs/Documentation/index.html
http://cesium.xin/cesium/cn/Documentation1.72/index.html
http://support.supermap.com.cn:8090/webgl/examples/webgl/examples.html#layer
Depiction point
viewer.entities.add({
name: name,
position: new Cesium.Cartesian3.fromDegrees(lon, lat, h),
// 广告牌
billboard: new Cesium.BillboardGraphics({
image: icon || "images/shuniu.png",
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
alignedAxis: Cesium.Cartesian3.ZERO,
disableDepthTestDistance: Number.POSITIVE_INFINITY,
// 可以显示的距离
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(
0,
height
),
}),
});
Draw line
// positions 是笛卡尔坐标系x y z
let polyCenter = Cesium.BoundingSphere.fromPoints(positions).center;
polyCenter = Cesium.Ellipsoid.WGS84.scaleToGeodeticSurface(polyCenter);
viewer.entities.add({
show: true,
position: polyCenter, // 为了找到线的中心点, 不需要可以不用写
name: row.PlacemarkName,
polyline: {
positions,
width: row.LineWidth || 2,
material: new Cesium.Color.fromCssColorString(row.LineColor || 'red'),
clampToGround: true,
show: true,
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(
0,
row.LineShowHeight
),
}
})
Add flash trail
First, you have to turn on the sparkle effect globally
viewer.scene.bloomEffect.show = true;
viewer.scene.hdrEnabled = true;
viewer.scene.bloomEffect.bloomIntensity = 1;
Then realize the trailing line
viewer.entities.add({
// 尾迹线
polyline: {
positions,
width: row.LineWidth || 2, // 线的宽度,像素为单位
material: new Cesium.PolylineTrailMaterialProperty({
// 尾迹线材质 值越大光越闪耀 0-1属于正常 1以上闪耀效果
color: new Cesium.Color(
1.00392156862745098,
3.8784313725490196,
0.3176470588235294,
1
),
trailLength: 0.4,
period: 10,
}),
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(
0,
row.LineShowHeight
),
},
ClampToGround: true,
});
Ripple radar circle
First, you have to extend the cesium method and save it as CircleWaveMaterialProperty.js
export class CircleWaveMaterialProperty {
constructor(options) {
options = Cesium.defaultValue(options, Cesium.defaultValue.EMPTY_OBJECT);
this._definitionChanged = new Cesium.Event();
this._color = undefined;
this._colorSubscription = undefined;
this.color = options.color;
this.duration = Cesium.defaultValue(options.duration, 1e3);
this.count = Cesium.defaultValue(options.count, 2);
if (this.count <= 0) this.count = 1;
this.gradient = Cesium.defaultValue(options.gradient, 0.1);
if (this.gradient < 0) this.gradient = 0;
else if (this.gradient > 1) this.gradient = 1;
this._time = performance.now();
}
}
Object.defineProperties(CircleWaveMaterialProperty.prototype, {
isConstant: {
get: function () {
return false;
}
},
definitionChanged: {
get: function () {
return this._definitionChanged;
}
},
color: Cesium.createPropertyDescriptor('color')
});
CircleWaveMaterialProperty.prototype.getType = function (time) {
return Cesium.Material.CircleWaveMaterialType;
}
CircleWaveMaterialProperty.prototype.getValue = function (time, result) {
if (!Cesium.defined(result)) {
result = {};
}
result.color = Cesium.Property.getValueOrClonedDefault(this._color, time, Cesium.Color.WHITE, result.color);
result.time = (performance.now() - this._time) / this.duration;
result.count = this.count;
result.gradient = 1 + 10 * (1 - this.gradient);
return result;
}
CircleWaveMaterialProperty.prototype.equals = function (other) {
return this === other ||
(other instanceof CircleWaveMaterialProperty &&
Cesium.Property.equals(this._color, other._color))
}
Cesium.Material.CircleWaveMaterialType = 'CircleWaveMaterial';
Cesium.Material.PolylineTrailSource = `czm_material czm_getMaterial(czm_materialInput materialInput)\n
{\n
czm_material material = czm_getDefaultMaterial(materialInput);\n
material.diffuse = 1.5 * color.rgb;\n
vec2 st = materialInput.st;\n
vec3 str = materialInput.str;\n
float dis = distance(st, vec2(0.5, 0.5));\n
float per = fract(time);\n
if (abs(str.z) > 0.001) {\n
discard;\n
}\n
if (dis > 0.5) { \n
discard; \n
} else { \n
float perDis = 0.5 / count;\n
float disNum; \n
float bl = .0; \n
for (int i = 0; i <= 999; i++) { \n
if (float(i) <= count) { \n
disNum = perDis *
float(i) - dis + per / count; \n
if (disNum > 0.0) { \n
if (disNum < perDis) { \n
bl = 1.0 - disNum / perDis;\n
}\n
else if
(disNum - perDis < perDis) { \n
bl = 1.0 - abs(1.0 - disNum / perDis); \n
} \n
material.alpha = pow(bl, gradient); \n
} \n
} \n
} \n
} \n
return material; \n
} \n`;
Cesium.Material._materialCache.addMaterial(Cesium.Material.CircleWaveMaterialType, {
fabric: {
type: Cesium.Material.CircleWaveMaterialType,
uniforms: {
color: new Cesium.Color(1.0, 0.0, 0.0, 1.0),
time: 1,
count: 1,
gradient: 0.1
},
source: Cesium.Material.PolylineTrailSource
},
translucent: function (material) {
return !0;
}
});
Cesium.CircleWaveMaterialProperty = CircleWaveMaterialProperty;
This method needs to exist before calling, that is, it has to be called globally once, so that cesium has the radar circle class
require("./CircleWaveMaterialProperty");
transfer
viewer.entities.add({
position: new Cesium.Cartesian3.fromDegrees(lon, lat, h),
ellipse: {
height: 1,
semiMinorAxis: 1000,
semiMajorAxis: 1000,
material: new Cesium.CircleWaveMaterialProperty({
duration: 2e3,
gradient: 0.5,
color: new Cesium.Color(1.0, 0.0, 0.0, 1.0),
count: 2,
}),
disableDepthTestDistance: Number.POSITIVE_INFINITY,
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(
0,
height
),
},
clampToGround: true,
billboard: {
image: this.renderText(name),
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
alignedAxis: Cesium.Cartesian3.ZERO,
disableDepthTestDistance: Number.POSITIVE_INFINITY,
pixelOffset: new Cesium.Cartesian2(0, -40),
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(
0,
height
),
},
});
Click on a layer and the corresponding pop-up window will appear
Note: Because it monitors the events of each frame, cesium will freeze if there are too many pop-up windows!
// 创建弹窗对象的方法
const Popup = function (info) {
this.constructor(info);
};
Popup.prototype.id = 0;
Popup.prototype.constructor = function (info) {
const _this = this;
_this.viewer = info.viewer;//弹窗创建的viewer
_this.geometry = info.geometry;//弹窗挂载的位置
_this.id = "popup_" + _this.__proto__.id++;
_this.html = info.html
const dom = document.createElement('div');
dom.className = 'bx-popup-ctn';
dom.id = _this.id;
_this.ctn = dom;
_this.viewer.container.appendChild(_this.ctn);
_this.ctn.insertAdjacentHTML('beforeend', _this.createHtml(info.title, info.data));
_this.render(_this.geometry);
_this.viewer.scene.postRender.addEventListener(_this.eventListener, _this)
}
Popup.prototype.eventListener = function () {
this.render.call(this, this.geometry);
}
// 弹窗的内容
Popup.prototype.createHtml = function (title, data) {
window.pop = this
return ` <div class="cesium-pupop-title">
<h1 class="title">${title}</h1>
<span class="iconfont icon-cha1" style="position: absolute;color: #00fbfb;top: 33px;right: 30px;cursor:pointer;" onclick="pop.close()"></span>
${data.length > 0 ? data.map(v => `<div class="cesium-row"><span>${v.name}:</span> <span>${v.value}</span></div>`).join('') : '<div class="cesium-row" style="color: #fff;text-align: center;height: 200px;line-height: 200px;">暂无属性</div>'}
</div>`
}
// 重点是实时刷新
Popup.prototype.render = function (geometry) {
var _this = this;
var position = Cesium.SceneTransforms.wgs84ToWindowCoordinates(_this.viewer.scene, geometry)
_this.ctn.style.left = `${position.x - Math.floor(_this.ctn.offsetWidth / 2)}px`
_this.ctn.style.top = `${position.y - _this.ctn.offsetHeight - 10}px`
}
// 关闭弹窗按钮
Popup.prototype.close = function () {
var _this = this;
_this.ctn.remove();
// _this.viewer.clock.onTick.removeEventListener(_this.eventListener);
_this.viewer.scene.postRender.removeEventListener(_this.eventListener, _this)
}
export default Popup;
transfer
new CesiumPopup({
viewer: viewer,
geometry: polyCenter, // 这个坐标是世界坐标也就是笛卡尔坐标!
title: entity._name,
data: ddd
});
How to set the height of the layer after getting the layer
const osgbLayer = viewer.scene.addS3MTilesLayerByScp(url, { name: row })
Cesium.when(osgbLayer, function (row) {
if (node.data.DisplayHeight) {
// 设置海拔高度
row._style3D.bottomAltitude = node.data.DisplayHeight
}
})
How to set the visible height of the layer after getting the layer
const osgbLayer = viewer.scene.addS3MTilesLayerByScp(url, { name: row })
Cesium.when(osgbLayer, function (row) {
// 可见海拔高度设置
// row.maxVisibleAltitude = node.data.MaxDisplayHeight
// 设置相机和图层的可见距离
row.visibleDistanceMax = layer.DisplayHeight || 100000;
})
Setting up the terrain
viewer.terrainProvider = terrainProvider = new Cesium.CesiumTerrainProvider({
// url形如: http://172.18.1.106:8090/iserver/services/3D-SuiZhouDianChang/rest/realspace/datas/图层名称
url: url + '/datas/' + name,
isSct: true
})
Load image
viewer.imageryLayers.addImageryProvider(new Cesium.UrlTemplateImageryProvider({
url: _url,
tilingScheme: new Cesium.WebMercatorTilingScheme(),
subdomains: '1234',
}));
Load server texture
viewer.imageryLayers.addImageryProvider(new Cesium.SuperMapImageryProvider({
url: '/iserver/services/3D-QuanMuTangChuSheFaBu/rest/realspace/datas/xxx影像缓存',
}));
Get entity attributes
First get the selected layer and its SMID
// 获取到选中的layer
const selectedLayer = scene.layers.getSelectedLayer();
if (selectedLayer) {
var selectedSmid = parseInt(selectedLayer.getSelection());
//取得超图属性
if(callback){
// 拿到layer和smid就行了
callback(selectedLayer, selectedSmid)
}
}
Query attributes based on SMID
doSqlQuery(sqlStr, dataSerice, dataset, datasource) {
const _this = this;
const sqlParameter = {
"datasetNames": [`${datasource}:${dataset}`],
getFeatureMode: "SQL",
queryParameter: {
attributeFilter: sqlStr
}
};
const url = `/iserver/services/${dataSerice}/data/featureResults.json?returnContent=true&token=${eval(localStorage.getItem('TOKEN_ISERVER'))}`
const queryData = JSON.stringify(sqlParameter);
const IGNOREFIELD = JSON.parse(localStorage.getItem('IGNOREFIELD'))
_this.loading = true
$.ajax({
type: "post",
url: url,
data: queryData,
success: function (result) {
if (result.features && result.features.length > 0) {
const data = result.features[0]
const fieldNames = data.fieldNames
const fieldValues = data.fieldValues
_this.moduleListData = []
fieldNames.forEach((row, i) => {
if (IGNOREFIELD.indexOf(row) !== -1) return
_this.moduleListData.push({
Name: row,
Value: fieldValues[i]
})
})
} else {
_this.$message.info('没有查询到属性!')
}
_this.loading = false
},
error: function () {
_this.$message.info('没有查询到属性!')
_this.loading = false
},
})
}
// 这么调用
this.doSqlQuery('SmID=' + this.relationListCode[1], layer.DataService, layer.SurMapDataSet, layer.DataSource)
Set layer transparency
function translucentLayers(scene, alpha) {
for (var i = 0; i < scene.layers.layerQueue.length; i++) {
var layer = scene.layers.findByIndex(i);
if (layer) {
layer.style3D.fillForeColor.alpha = parseFloat(alpha);
}
}
}
Set image transparency
const _layers = viewer.imageryLayers._layers
for (let i = 0, len = _layers.length; i < len; i++) {
_layers[i].alpha = 0.6
}
Listen for click events
const events = {
click: "LEFT_CLICK",
wheel: "WHEEL",
middleClick: "MIDDLE_DOWN",
mouseMove: "MOUSE_MOVE"
}
viewer.screenSpaceEventHandler.setInputAction(e => {
this.$emit(key, e)
}, Cesium.ScreenSpaceEventType[events[key]])
Get layer by hypergraph name
viewer.scene.layers.find(SuperLayerName)
Set and change widget color
layer.setObjsColor(ids, cesiumColor);
in:
- layer is the layer object
- ids is the smid array
- cesiumColor is the color object of cesium
Use this method if you only need to affect one component
layer.setOnlyObjsColor(smId, cesiumColor);
Get all the smids under it through the layer
layer._selections
What is returned is ["3762", "123"] such smid collection
Hidden widget
layer.setObjsVisible(ids, bool)
in
- layer is the layer object
- ids is the smid set
- bool is whether to display, true is displayed false is hidden
To display all the components under the layer, you only need to set ids to [].
layer.setObjsVisible([], false);
Use this method if you only need to affect one component
layer.setOnlyObjsVisible(smid, bool)
Set the light source to follow the camera
//设置光源跟随
var degZ = 0;//水平夹角
var degX = 0; //垂直夹角
scene.sun.show = false;
// 设置环境光的强度
scene.lightSource.ambientLightColor = new Cesium.Color(0.86,0.86, 0.86, 1);
// var position1 = new Cesium.Cartesian3.fromDegrees(117.61862360516848 - 0.000009405717451407729 * 86.6, 40.2317259501307 - 0.00000914352698135 * 50, 350);
// 设置初始光源位置
var position1 = new Cesium.Cartesian3.fromDegrees(117.61862360516848, 32.19180102105889, 350);
var targetPosition1 = new Cesium.Cartesian3.fromDegrees(117.61862360516848, 32.19180102105889, 130);
var dirLightOptions = {
targetPosition: targetPosition1,
color: new Cesium.Color(1.0, 1.0, 1.0, 1),
intensity: 0.7
};
directionalLight_1 = new Cesium.DirectionalLight(position1, dirLightOptions);
scene.addLightSource(directionalLight_1);
scene.postRender.addEventListener(function () { // 每一帧 非常耗性能
var cameraPosition = Cesium.Cartesian3.clone(scene.camera.position);
var length = 100;
var quad1 = Cesium.Quaternion.fromAxisAngle(viewer.scene.camera.upWC, Cesium.Math.toRadians(degZ));
var quad2 = Cesium.Quaternion.fromAxisAngle(viewer.scene.camera.rightWC, Cesium.Math.toRadians(degX));
var resQuad = Cesium.Quaternion.add(quad2, quad1, quad1);
var rotation = Cesium.Matrix3.fromQuaternion(resQuad);
var direction = Cesium.Matrix3.multiplyByVector(rotation, viewer.scene.camera.directionWC, new Cesium.Cartesian3());
var targetPosition2 = Cesium.Cartesian3.add(
viewer.scene.camera.positionWC,
Cesium.Cartesian3.multiplyByScalar(direction, length, new Cesium.Cartesian3()),
new Cesium.Cartesian3()
);
directionalLight_1.position = cameraPosition;
directionalLight_1.targetPosition = targetPosition2;
});
Click on a certain point to display a pop-up window and use the Vue component to complete
Pop.js
// 创建弹窗对象的方法
import Vue from 'vue'
const Popup = function (info, component) {
this.constructor(info, component)
}
Popup.prototype.id = 0
Popup.prototype.constructor = function (info, component) {
const _this = this
window.pop = this
_this.viewer = info.viewer// 弹窗创建的viewer
_this.geometry = info.geometry// 弹窗挂载的位置
// eslint-disable-next-line no-proto
_this.id = 'popup_' + _this.__proto__.id++
_this.html = info.html
const dom = document.createElement('div')
dom.className = 'bx-popup-ctn'
dom.id = _this.id
_this.ctn = dom
// 主要步骤
if (component) {
const vuecomponent = Vue.extend(component)
// eslint-disable-next-line new-cap
const c = new vuecomponent().$mount()
_this.ctn.appendChild(c.$el)
} else {
_this.ctn.insertAdjacentHTML('beforeend', _this.createHtml(info.title, info.data))
}
_this.viewer.container.appendChild(_this.ctn)
_this.viewer.scene.postRender.addEventListener(_this.eventListener, _this)
}
Popup.prototype.eventListener = function () {
this.render(this.geometry)
}
// 弹窗的内容
Popup.prototype.createHtml = function (title, data) {
let html
if (Object.prototype.toString.call(data) === '[object Array]') {
html = data.reduce((acc, val) => {
return acc + `<div class="bx-attribute-item">
<span class="bx-attr-name">${val.PropertyName}</span>
<span class="bx-attr-name">${val.value}</span>
</div>`
}, '')
} else {
html = data
}
return `
<div class="bx-popup">
<img src="${require('./image/attribute/ff.png')}" alt=""/>
<div class="bx-content">
<div class="bx-top"></div>
<div class="bx-bd-c-bottom"></div>
<div class="bx-bd-c-left"></div>
<div class="bx-bd-c-right"></div>
<div class="bx-bd-dashed-top"></div>
<div class="bx-bd-dashed-left"></div>
<div class="bx-bd-dashed-bottom"></div>
<div class="bx-bd-dashed-right"></div>
<img src="${require('./image/attribute/hh.png')}" alt="" class="bx-bd-dashed-c-bottom"/>
<img src="${require('./image/attribute/gg.png')}" alt="" class="bx-bd-bottom"/>
<img src="${require('./image/attribute/cc.png')}" alt="" class="bx-bd-right"/>
<div class="bx-body">
<h1 class="bx-title">${title}</h1>
<div class="bx-body-content">
${html}
</div>
</div>
</div>
</div>
`
}
// 重点是实时刷新
Popup.prototype.render = function (geometry) {
const _this = this
const position = Cesium.SceneTransforms.wgs84ToWindowCoordinates(_this.viewer.scene, geometry)
if (position) {
_this.ctn.style.left = `${position.x}px`
_this.ctn.style.top = `${position.y - _this.ctn.offsetHeight / 2 - 10}px`
}
}
// 关闭弹窗按钮
Popup.prototype.close = function () {
const _this = this
_this.viewer.scene.postRender.removeEventListener(_this.eventListener, _this)
_this.ctn.remove()
// _this.viewer.clock.onTick.removeEventListener(_this.eventListener);
}
export default Popup
when using it
new Popup({
viewer,
geometry: e.data.position,
title: '门禁信息',
data: '<div>Fuck</div>'
}, AccessControl)
Among them: AccessControl is a vue component!
import AccessControl from '@/components/AccessControl.vue'
Mainly used Vue's $mount()
method
Get camera information
viewer.scene.camera
Convert world coordinates to screen coordinates
Cesium.SceneTransforms.wgs84ToWindowCoordinates(scene, geometry)
in
- scene is the scene
- geometry is the world coordinate
Create a Color instance based on the CSS color value.
Cesium.Color.fromCssColorString('#67ADDF');
Cesium color value and regular HTML color value conversion formula
After some research, I found that in Cesium.Color(r, g,b,a), the values of r,g,b,a are all between 0-1. The conversion to html rgba is as follows:
Cesium.Color(html.r/255, html.g/255, html.b/255, html.a)
The js method is as follows, where colorString must be a hexadecimal color
colorConvert(colorString) {
const red =
parseInt(colorString.slice(1, 3), 16) / 255;
const green =
parseInt(colorString.slice(3, 5), 16) / 255;
const blue =
parseInt(colorString.slice(5, 7), 16) / 255;
return new Cesium.Color(red, green, blue, 1);
},
Aggregate label and billboard
_this.clusteringlayer = new Cesium.CustomDataSource('clusteringlayer');
const pixelRange = 50;
const minimumClusterSize = 2;
const enabled = true;
//启用集群
_this.clusteringlayer.clustering.enabled = enabled;
//设置扩展屏幕空间边界框的像素范围。
_this.clusteringlayer.clustering.pixelRange = pixelRange;
//可以群集的最小屏幕空间对象
_this.clusteringlayer.clustering.minimumClusterSize = minimumClusterSize;
//将进行实体的广告牌聚类
_this.clusteringlayer.clustering.clusterBillboards = true;
var removeListener;
//自定义地图图钉生成为画布元素
var pinBuilder = new Cesium.PinBuilder();
customStyle();
function customStyle() {
if (Cesium.defined(removeListener)) {
removeListener();
removeListener = undefined;
} else {
removeListener = _this.clusteringlayer.clustering.clusterEvent.addEventListener(function(clusteredEntities, cluster) {
cluster.label.show = false;
cluster.billboard.show = true;
cluster.billboard.id = cluster.label.id;
cluster.billboard.verticalOrigin = Cesium.VerticalOrigin.BOTTOM;
cluster.billboard.disableDepthTestDistance = Number.POSITIVE_INFINITY;
//文本将被调整为尽可能大的大小同时仍完全包含在图钉中
// var pinimg = pinBuilder.fromText(clusteredEntities.length, Cesium.Color.BLUE, 50).toDataURL();
// var pinimg='./images/location4.png';
if (clusteredEntities?.[0]?._name) cluster.billboard.image = _this.renderText(clusteredEntities[0]._name, undefined, undefined, 14);
//cluster.billboard.scale=0.2;
});
}
}
// 对于需要聚合的实体使用
// _this.clusteringlayer.entities.add(entity)
// 添加到viewer中
viewer.dataSources.add(_this.clusteringlayer)
Hypergraph dynamic drawing summary
Initialize drawing and load annotation library
methods: {
// 初始化
InitPlot(viewer, serverUrl) {
if (!viewer) {
return;
}
const _this = this;
const plottingLayer = new Cesium.PlottingLayer(
viewer.scene,
'plottingLayer'
);
this.plottingLayer = plottingLayer;
viewer.scene.plotLayers.add(plottingLayer);
const plotting = Cesium.Plotting.getInstance(
serverUrl,
viewer.scene
);
this.plotting = plotting;
this.plotEditControl = new Cesium.PlotEditControl(
viewer.scene,
plottingLayer
); //编辑控件
this.plotEditControl.activate();
this.plotDrawControl = new Cesium.PlotDrawControl(
viewer.scene,
plottingLayer
); //绘制控件
this.plotDrawControl.drawControlEndEvent.addEventListener(
function() {
//标绘结束,激活编辑控件
_this.plotEditControl.activate();
}
);
this.loadSymbolLib(plotting);
console.log(plotting.getDefaultStyle());
// 一些缺省属性,不需要可以删除
plotting.getDefaultStyle().lineWidth = this.thickness;
plotting.getDefaultStyle().lineColor = this.colorConvert(
this.color
);
plotting.getDefaultStyle().defaultFlag = true;
},
// 加载标注库
loadSymbolLib(plotting) {
const symbolLibManager = plotting.getSymbolLibManager();
if (symbolLibManager.isInitializeOK()) {
// isok
} else {
symbolLibManager.initializecompleted.addEventListener(
function(result) {
if (result.libIDs.length !== 0) {
// isok
}
}
);
symbolLibManager.initializeAsync();
}
},
}
Only need to execute the InitPlot
method
this.InitPlot(
viewer,
'/iserver/services/plot-jingyong/rest/plot'
);
How to draw a mark without using a panel
handleDraw(id, code) {
this.plotDrawControl.setAction(id, code);
this.plotDrawControl.activate();
this.plotEditControl.deactivate();
},
a mark requires a 161272deff2af7 id and code , then how to get the id and code?
If it is a basic mark (line or the like)
You can click the drawn label to view the attributes. There are id and code in the attributes">http://support.supermap.com.cn:8090/webgl/examples/webgl/editor.html#plot_dynamicPlot You can click on the drawn Annotate to view the attributes, there are id and code
In addition to the basic mark
http://${ip or domain name}/iserver/services/plot-jingyong/rest/plot/symbolLibs/ You can see all the mark libraries
How to predefine styles
Modify the default label color of Hypergraph, etc.
plotting.getDefaultStyle().lineWidth = this.thickness;
plotting.getDefaultStyle() from the console, and you can modify the default attributes by directly assigning values
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。