var uploadedDataURL = '/asset/get/s/data-1625654057443-57iqD-KYT.css'; var htmlStr = `

varStr

`; // 请求样式文件 function getStyleTxt() { $.get(uploadedDataURL, function (style) { // 加载样式文件，动态插入到head标签中 var ele = document.createElement('style'); ele.innerHTML = style; document.getElementsByTagName('head')[0].appendChild(ele); // 将图表选择一个合适的位置放置 var cssText = ` display: flex; justify-content: space-around; align-content: center; flex-wrap: wrap; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 99; background-color: #000; `; var box = document.getElementById('chart-panel') var dom = document.createElement('div'); dom.style.cssText = cssText; // 动态创建两个水球容器 var waves1 = document.createElement('div'); var waves2 = document.createElement('div'); // 设置水球刻度值 waves1.innerHTML = htmlStr.replace(/varStr/g, '50%'); waves2.innerHTML = htmlStr.replace(/varStr/g, '80%'); dom.appendChild(waves1); dom.appendChild(waves2); box.appendChild(dom) }); } getStyleTxt();

SVG水球图