【example】新增组件知识图谱的例子；修复主题样式会闪烁一次的问题 review by luoxiao

chenxianhuii · chenxianhuii · commit c7fec527afa1 · 2023-07-17T16:52:49.000+08:00
diff --git a/build/jsdocs/template/tmpl/layout.tmpl b/build/jsdocs/template/tmpl/layout.tmpl
@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <script src="scripts/prettify/prettify.js"></script>
     <script src="scripts/prettify/lang-css.js"></script>
+    <script src="scripts/css-vars-ponyfill.min.js"></script>
     <script src="../../examples/js/utils.js"></script>
     <script src="../../examples/js/theme/themeConfig.js"></script>
     <script src="../../examples/js/theme/theme.js"></script>
@@ -15,7 +16,6 @@
     <![endif]-->
         <script src="scripts/jquery.min.js"></script>
     <script src="scripts/adminlte/app.min.js"></script>
-    <script src="scripts/css-vars-ponyfill.min.js"></script>
     <link type="text/css" rel="stylesheet" href="styles/bootstrap.min.css">
     <link type="text/css" rel="stylesheet" href="styles/adminlte/AdminLTE.min.css">
     <link type="text/css" rel="stylesheet" href="styles/adminlte/skin-blue.min.css">
diff --git a/examples/component/components_knowledgeGraphMap_vue.html b/examples/component/components_knowledgeGraphMap_vue.html
@@ -0,0 +1,44 @@
+<!--********************************************************************
+* Copyright© 2000 - 2023 SuperMap Software Co.Ltd. All rights reserved.
+*********************************************************************-->
+<!--********************************************************************
+* 该示例需要引入 
+* vue-iclient (https://github.com/SuperMap/vue-iclient)
+* G6 (https://github.com/antvis/G6)
+*********************************************************************-->
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="UTF-8">
+  <title data-i18n='resources.title_componentsLegend_Vue'></title>
+  <script type="text/javascript" include="vue" src="../js/include-web.js"></script>
+  <script include="iclient-mapboxgl-vue,g6" src="../../dist/mapboxgl/include-mapboxgl.js"></script>
+  <style>
+     #main{
+        margin: 0 auto;
+        width: 100%;
+        height: 100%;
+    }
+  </style>
+</head>
+
+<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
+  <div id="main">
+    <sm-graph-map :service-url="url"></sm-graph-map>
+  </div>
+  <script>
+    new Vue({
+      el: '#main',
+      data () {
+        var host = window.isLocal ? window.server : 'https://iserver.supermap.io';
+        return {
+          url: host + '/iserver/services/knowledgeGraph-budongchan/restjsr/graph/graphmaps/图谱'
+        }
+      }
+    })
+
+  </script>
+</body>
+
+</html>
diff --git a/examples/component/config.js b/examples/component/config.js
@@ -354,6 +354,13 @@ var exampleConfig = {
             version: '10.0.0',
             thumbnail: 'components_geojson_vue.png',
             fileName: 'components_geojson_vue'
+          },
+          {
+            name: '知识图谱',
+            name_en: 'Knowledge GraphMap',
+            version: '11.1.0',
+            thumbnail: 'knowledgeGraphMap.png',
+            fileName: 'components_knowledgeGraphMap_vue'
           }
         ]
       },
diff --git a/examples/component/img/knowledgeGraphMap.png b/examples/component/img/knowledgeGraphMap.png
diff --git a/examples/js/theme/theme.js b/examples/js/theme/theme.js
@@ -47,15 +47,12 @@ function setRootStyle (theme) {
   rootStyleTag.innerHTML = rootStyle;
 }
 
-var getCookie = utils.getCookie;
-document.addEventListener("DOMContentLoaded", function() {
-  initSkin();
-});
+initSkin();
 
 function initSkin() {
-  var skin = getCookie('theme') || 'dark';
-  var bodyElem = document.querySelector('body');
-  bodyElem.classList.remove("light", "dark");
-  bodyElem.classList.add(skin);
+  var skin = utils.getCookie('theme') || 'dark';
+  var rootElem = document.querySelector('html');
+  rootElem.classList.remove("light", "dark");
+  rootElem.classList.add(skin);
   setRootStyle(skin);
 }

Original file line number	Diff line number	Diff line change
`@@ -354,6 +354,13 @@ var exampleConfig = {`
`354`	`354`	`version: '10.0.0',`
`355`	`355`	`thumbnail: 'components_geojson_vue.png',`
`356`	`356`	`fileName: 'components_geojson_vue'`
	`357`	`+ },`
	`358`	`+ {`
	`359`	`+ name: '知识图谱',`
	`360`	`+ name_en: 'Knowledge GraphMap',`
	`361`	`+ version: '11.1.0',`
	`362`	`+ thumbnail: 'knowledgeGraphMap.png',`
	`363`	`+ fileName: 'components_knowledgeGraphMap_vue'`
`357`	`364`	`}`
`358`	`365`	`]`
`359`	`366`	`},`