SovitChart示例

Sovit2D示例

Sovit3D示例


<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<meta name="referrer" content="no-referrer" />
	</head>

	<body style="background-color: #e5e7ea;">
		<div class="main-case" style="min-height: 500px;padding-top: 30px;">
			<div class="sovitjs_body">
				<div id="main_div" style="display: flex;width: 1525px;">
					<div style="width:900px;background-color: #FFFFFF;box-shadow: 0 1px 7px 4px #c0c5cb;padding-top: 2px;height: 796px;margin-left: 10px;overflow-y: auto;">
						<div id="chart_bar_1" style="width:1366px;height: 768px;margin-top: 20px;position: relative;">
							<iframe id="demo_iframe" ref="demoIframe" style="border:1px #69f solid" src="" scrolling="auto" width="100%" height="768" frameborder="no" border="0" marginwidth="0" marginheight="0" allowtransparency="yes">
							</iframe>

							<div class="test_click_div" style="cursor: pointer;line-height: 30px;">查看曲线</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- footer部分 -->
		
<div class="main-product" style="padding-bottom: 80px;background:url('res/static/img/index/p6_bg.jpg') ;background-repeat:no-repeat ;background-size:100% 100%;">
	<div class="layui-container">
		<div style="padding: 20px;">
			<p class="title" style="margin-top: 80px;font-size: 36px;font-weight: 600;color: #000000;letter-spacing: 2px;line-height: 60px;">通过数维图软件平台,实现零代码可视化开发!</p>
			<div style="text-align: center;margin-top: 50px;">
				<a href="https://admin.sovitjs.com" class="btn-standard2" target="_blank" style="padding: 8px 25px !important;color:#FFFFFF;line-height: 50px;border-radius: 45px;width: 240px;font-size: 20px !important;"> 免费开发我的场景 <img src="res/static/img/index/jt-b.png" width="20" style="margin-top: -2px;" /> </a>
			</div>
		</div>
	</div>
</div>
<div class="footer" style="background-color: #FFFFFF;">
	<div class="layui-container">

		<div class="layui-row footer-contact" style="padding-top: 100px;">
			<div class="layui-col-sm12 layui-col-lg12">
				<div class="layui-row">
					<div class="layui-col-sm6 layui-col-md8 layui-col-lg9" style="width: 100%;display: flex;">
						<div style="width: 20%;">
							<div style="font-size: 16px;color: #333333;font-weight: 700;">产品服务</div>
							<div style="line-height: 35px;padding-top: 20px;">
								<div>
									<a href="sovitChart_detail.html">图表可视化SovitChart</a>
								</div>
								<div>
									<a href="sovit2D_detail.html">2D可视化 Sovit2D</a>
								</div>
								<div>
									<a href="sovit3D_detail.html">3D可视化 Sovit3D</a>
								</div>
								<div>
									<a href="cloud_publish.html">云部署paas服务</a>
								</div>
								<div>
									<a href="private_publish.html">私有化部署服务</a>
								</div>
								<div>
									<a href="base_service.html">基础服务</a>
								</div>
							</div>
						</div>
						<!--<div style="width: 20%;">
							<div style="font-size: 16px;color: #333333;font-weight: 700;">行业解决方案</div>
							<div style="line-height: 35px;padding-top: 20px;">
								<div>
									<a href="document.html?appType=a1&id=2722604312709562375">智慧电力</a>
								</div>
								<div>
									<a href="document.html?appType=a1&id=2722605620300611584">智慧油库</a>
								</div>
								<div>
									<a href="document.html?appType=a1&id=2722609098745970694">智慧环境</a>
								</div>
								<div>
									<a href="document.html?appType=a1&id=2722609180006416391">智慧水利</a>
								</div>
								<div>
									<a href="document.html?appType=a1&id=2734946125244006406">智慧矿山</a>
								</div>
								<div>
									<a href="document.html?appType=a1&id=2734946125244006406">智慧城市</a>
								</div>
								<div>
									<a href="document.html?appType=a1&id=2734946125244006406">智慧消防</a>
								</div>
								<div>
									<a href="document.html?appType=a1&id=2734946125244006406">智慧工厂</a>
								</div>
							</div>
						</div>-->
						<div style="width: 20%;">
							<div style="font-size: 16px;color: #333333;font-weight: 700;">服务支持</div>
							<div style="line-height: 35px;padding-top: 20px;">
								<div>
									<a href="document.html?appType=a1&id=2722604312709562375">新手入门</a>
								</div>
								<div>
									<a href="video_2d.html">视频教程</a>
								</div>
								<div>
									<a href="example_1.html">开发示例</a>
								</div>
								<div>
									<a href="article_list.html">技术博客</a>
								</div>
								<div>
									<a href="document.html">常见问题</a>
								</div>
								<!--<div><a href="document.html">Sovit2D文档中心</a></div>
								<div><a href="document.html?appType=a2&id=2809645354629201924">SovitChart文档中心</a></div>-->
							</div>
						</div>
						<div style="width: 20%;">
							<div style="font-size: 16px;color: #333333;font-weight: 700;">示例模板</div>
							<div style="line-height: 35px;padding-top: 20px;">
								<div>
									<a href="demo.html">Sovit2DWEB组态模板</a>
								</div>
							</div>
							<div style="line-height: 35px;">
								<div>
									<a href="demo_3d.html">Sovit3D三维模型仓库</a>
								</div>
							</div>
							<div style="line-height: 35px;">
								<div>
									<a href="chart_template.html">SovitChart大屏模板</a>
								</div>
							</div>
						</div>
						<div style="width: 20%;">
							<div style="font-size: 16px;color: #333333;font-weight: 700;">关于我们</div>
							<div style="line-height: 35px;padding-top: 20px;">
								<div>
									<a href="about.html">公司简介</a>
								</div>
							</div>
							<div style="line-height: 35px;">
								<div>
									<a href="article_list.html">行业资讯</a>
								</div>
							</div>
							<div style="line-height: 35px;">
								<div>
									<a href="about.html?#lxwm">联系我们</a>
								</div>
							</div>
							<div style="line-height: 35px;">
								<div>
									<a href="document-a2-2809652728257576969.html">隐私政策</a>
								</div>
							</div>
							<div style="line-height: 35px;">
								<div>
									<a href="document-a2-2809652596615151616.html">使用协议</a>
								</div>
							</div>
						</div>

						<div style="width: 20%;">
							<div style="font-size: 16px;color: #333333;font-weight: 700;">联系我们</div>
							<div style="line-height: 35px;padding-top: 20px;">
								<div style="color: #a5aaa9;">
									咨询:0731-84423475
								</div>
							</div>
							<div style="line-height: 35px;">
								<div style="color: #a5aaa9;">
									电话:18511372161
								</div>
							</div>
							<div style="line-height: 35px;">
								<div style="color: #a5aaa9;">
									邮箱:269192861@qq.com
								</div>
							</div>
							<div style="line-height: 35px;">
								<div style="color: #a5aaa9;">
									地址:长沙市岳麓区延农路欧富安科技园
								</div>
							</div>
						</div>

						<div class="layui-col-sm6" style="text-align: right;width: 20%;">
							<div><img src="./res/static/img/erweima.jpg" width="220"></div>
							<div style="font-size: 13px;color: #000000;text-align: center;">微信公众号</div>
						</div>
					</div>
					<div class="layui-col-sm6 layui-col-md4 layui-col-lg3">

						<!--<div class="layui-col-sm6">
							<div><img src="./res/static/img/sovitwx.jpg" width="90"></div>
							<div style="font-size: 13px;">业务咨询微信号</div>
						</div>-->
						<!--<div>
							<p>&nbsp;&nbsp;</p>
							<p class="contact-bottom">		<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAAAXNSR0IArs4c6QAAIABJREFUeF7tXQe0LUWVPdswGAfMig4Yx4wBFVARAUVAUBEkiQFQkgkQREEyKoJIUkFBwFEQREQFxISjDCYUs2LEnCMOYp49a/9f7/v+493uOnW7uqvvq7PWW7DWP1V1+nTvW+mcfWAzLCTvZGZPN7MHm9ka8/5oZj8Ifz81s6+b2TkArp1hd9RHS/AAEtoU3YTkvczsiWa2hZk92WHsjwSSAJSvOtpV1Rn2wMwAhOTaZrZb+Jv2lR0M4KhpO6ntx++B0QOkY2DMf6OXAth8/K+4PsE0HhgtQEje3sz2N7OXTeOAlrbXAlgtY/+168I9MEqAkNwlAOO+Pfj3+wDu2cM4dYgCPTAqgJC8s5m9MZxM9enOiwA8pc8B61hleGA0ACG5TgCHNuNDyAkA9hli4DrmcB4YBUBIbhvAoX3HkPIaAAcOaUAdu18PFA8QktqEv7ZftzSOdgCAYwqyp5qS0QNFA4Sk9ht7dfj8XzGzK81Mz72umT0wse+tAbwnsW1tNiIPFAsQkhc7b8Inuf2TZnaWmX0QwE/mK5F8rpkdamZ3d74zhadsDkCAqzLDHigSICT14Sl+ahr5oJmdCeBdTZ2QXMvMLjWz1Z2DfTyA5M/OdlV9RB4oDiAk/2Bmq07hwy+a2TEAzo3tg+SGASSrxLYJeqcDeL6zTVUfkQeKAghJBQk+KNF/15vZsQEc+n+XhJOy81yNlivXTXuC08bSpBiAkDzIzFIDBC83s70BaPZIFpIvMLM3JHTwdAAXJrSrTQr3QBEAIfkMM2vcKzT48SwAO3flZ5KHhY27p8vvmdmTAOi/VWbIA4MDhOQjzewTZnbzBL/uC+D4hHaNTUieaWY64fLIhQCUnFVlhjxQAkA+YGabJfj0Z2a2LQAd43YqJG9hZjpm1ubdI4cD0AxUZUY8MChASO5oZmdP4cv3B5D8dYo+Fm1K8v5mdomZ3cPZd92POB1WsvrQAPl0uNGexkeHADhymg4mtSWpmU0zyY0c/df9iMNZpasOBpApTowW+vS6MIvosq9zIbmHmZ3i7LjuR5wOK1V9EICQ1EXgZ8zsfh05Rrfa2wH4VUf9rdQNydeZ2UudfR8G4HBnm6pemAeGAoj3zuNUM9vazO7Q4L/jAOyXw78kb2JmHzGzxzv7r/sRp8NKU+8dICR1nCseqtjNr5ZQ9w4AUXRvk+zgCTHxvIyQsCWQ3NrRru5HHM4qUXUIgDzTzN7hcMb+ALTEMZJvN7OdGtrqJl1Hv9919B+tSlKh920gXdhf3Y9Ee7g8xSEAojyKrSJdoajedQD8JQBEpHCK0tWMMklOAyB+rCxC8q1mJtIIj9T9iMdbBen2ChCSSlD6muP59wKw0gkSyZgZaHcAb3GME61KUvsgLbUeEt1ouWLdjzgdVoJ63wA5xMxiT3ZEBbrWYny5JBVQqMDCSaK1v5ZaX8jhZJKbhvB4T/d1P+LxViG6fQPkS45f3qMBvGIxP5G8TfgVb2I4OQ/A9rn8nBh9XPcjuV5Ipn57AwhJ8Uq9z/Ecmj0mkkiT3NLMFGrSJCs2+I5xo1VJevZTc/1mtSna+KoY5YE+AaK88OdEWbW8FIH2Go1C8lVm1kTD8+twgfjfbX2l/DvJ/wwzmUorxIoOHDYCoDCbKoV7oBeAkLyxmf3YzO4S6Y8tAChQsFVIfqwl6lanXrpl/2NrZwkKJHcIZRM8rS8D8ARPg6o7jAf6Aog+Bp38xMh3AdwnRlE6JB8Xjn6b8kmOAnBwbJ9evcRQlCMAiFGlSsEe6AsgirZ9ZaQfTgbw4kjdZWokDzCzoxva/C2cann2QNEmTBGKoizED0cPVBV790BfAFHGoH7pY0R8U+7IXJLKCX9awwCfMrPtAWip17kkhqKIxE77kT91blDtsBMPZAdIOJL9XaS1ruXV/D5JqhSCgKi6hJPkJAAvibTFrUbyhWZ2srPh8QD2dbap6j15oA+AbGNm50c+j3t5tQAkMbkbzwagmK4sQlIZksqU9Mg2AC7wNKi6/XigD4AoVEQfbowkLa8WgORtZvbshsEU6qKlliKKOxeSojG9zMw8RXe+YWYbA/hF5wbVDqfyQB8A+baZxZxK/RKACuRMJSQVjv55M9MdxSTplCpo4SCJR79ZgyyncuoSbpwVICR1gfbDSP9+FIDKN08tkR/oiwCkkMRF2UfyRDNzncaJagiAZsAqhXggN0DEExW7tu50s0ryJDN7UYOfFQyppVaWG+0wk33UzB7leNc6YdNS6zuONlU1owdyA8RT/GYXACJs60xI6hhVxHSTREfDykLsnDZIA5LUjOi95zgXgG7nqxTggdwAOc3Mnhf5nA8G4MkVae023LLr6LdJDgLw6tbOEhVI6gb/CGfzrMs/py1LWj03QBQkGEN0kK0eOcm2W/xrw1JLMVtZhKSXPVIlIHSBOBUZd5aHWWKd5gaIKjrdNcKnlwPYIEIvSYWk9gIbNzTWseyOGWmDHhaOfpXHEiuXANgiVrnq5fFANoAE9pLYOh2vB+DlnYr2CEnlsn/ZzG7Z0Oi1AF4e3alTMZHw4UAAr3EOVdU79EBOgKi0mT7KGLlB7nlMI48OSYWYnNDQhmGplVqGodUckv9lZs9qVfyXwj/DUkv1T6oM4IGcAPEc8Ubnf0zjI5I6cm4qUfC5sNTKRRukeyEt92IuTuce9QIACtepMoAHcgLEc8TbmF7blV9I3szMrmlJ3DoVwJ5djbmwn8RSb48EoOiAKj17ICdAPEe8qy3GXpLDF5HVrHYDIPuzCMnXm9k+js51gPBOh35V7cgDOQEy+BHvJB9FVJBS/JguEHPRBqlAj07O1o18j/sBOC5St6p16IGcANF6/hERtn4VgDb0vQrJq1vY5aOII1KNJrlRAElMF7VyVYyXMujkBIhCuFWlqU0GOe8n+WgzayvflvWXm6ROzmKkAiTGSxl0cgJEUbwxdDinABApdO9CUiEmi5LTBWOUn6H1f+e0QSQ9hxgVIL1/HcsHzAmQ35rZbSOea9CXT1KFfNZpsFP0QwJJZ7RBkQcF8016KoA2krwIV1cVrwdyAkQEaatEGDQ0QNY0sx+02NkZRU8COGTa/QB8K8KXVaVjD2QBSKDB+XukrYMCRDZG1EtUyIxmkWTaIJKrm5kqa3mXk18G8NBIX1a1jj2QCyCrmdnvI20dHCABJKIaEmv7JPkfM3tmCm0QSdUTEUWqYsK8si+A472Nqn43HsgFEEXwKpI3RkoBiOoQip6oqcTaiQD2jnmoADpFKKtuYmpUrnz4UADaz1UZwAO5ACLChNg1cxEACR+0iOeUZdgkrbRBociOZoxoME0Y8AUA3jTAd1GHDB7IBZCHm9lVkV4uBiABJKeb2a4NtitCWUutRWmDQli7jnC1+Z9GzgDQZMc0fde2kR7IBZD1zSw2RLsogASQtCV6nQlgpTqFJJU5Kf7hpsSsyNdilf091lOZ9XIBRDFGsWwhJQJETCSfbfH9srzxsJw6LOF0alL3xfkj8zdYdPe5APJgM1OF2hgp8oMgKaKFppIJujs51sxUwuCOMQ8aobMrgDMi9KpKTx7IBRAdZ8YmHRXLKEhS0bzKJ88tmq1eM809S24Dl2r/uQAiCtGfRzp1kGDFGNtIeo6rY7pcqKO6Jco5fzUA/X+VwjyQCyC6S4iNXfoiAJ16FSkkdzezUzMYp1t5zRpte50MQ9cuYz2QCyCqSfiPSCM6Ia2OHCtJjeRFU1z2LRxTpbDF4pKtBEPSQ9ZGi3ogC0A0EkmFijcVs5lv0E0AiMGjWHHkbkx6Bt3SK9VW4PhzsQ9aDVvJAzkBoqVDLHHzGikxTn29y8SiOPPNe0sARmx0QV+PVsdp8UBOgKiqVCxdzXoAlJdRnJDczszOTTRMdKaaMWIr/CYOU5vl8kBOgLzOzGLZErcG8J5cD5naL0nxVym3flVnH1pC6SLxrc52Vb0wD+QEiIrHqIhMjBTJZk5SoN0q5gHm6fzMzLYDcIWzXVUv0AM5AfJUM3tv5DNn5eaNtGElNZI6YPDWDOysSlaKzbVN9x7ICRBPyPsnATy2+8dL75GkOHTFpRsrNfo21lMj0ssGEPmApC4LmxKQ5lyl9NxVAMTS4GR3Mck3m9lukQNdBOApkbpVbUQeyA2QWHZFuexRALQhLkJIigt37UhjtgRwcaRuVRuRB3IDxHOSlb0Egue9OC4Ga+6Gx7Ej080NEBWjPCfSJ1lrl0fasELNAZCzAezk7b/qj8MDuQHi2ahfDeABpbjNAZCjATSxM5bySNWOBA9kBUjYqP/GzG4XaduaAFS/fHAhqfDzm0YY8nYAz47Qqyoj9EAfAPGUHSvmRp1kW1763Ov+CoCHjPDdV5MjPNAHQDz7ECUOiX1wcCGpEsyxjIad13gf3AHVgGUe6AMgdzOzH0f6+8MAnhSpm1WNpIp5PiNykFcBEKNJlRnzQHaAhH2IKIBEBRQjDwSg2iKDCsntzSy27Nn3zEyzSM3zGPStdT94XwA5KhA3xzzBAQCOiVHMqUPSk1cvUyoLYs4XMlDffQFEyyblRsTIFQBiZ5uY/pJ1SOp2/MmRHXzHzJTXUnl0Ix02BrVeABKWWfqA7h3plHVLIDMguaOZnR1ps9TqXsThrDGo9gmQk5REFOmUYj40kiLAExFejPwpzCJfjVGuOuV7oE+AbGZmH4h0STF3CyRfHrirIk23G/D2xjaseuV5oDeAJCyzNikhlztw76oartJvY2VTAB+KVa565Xqgb4B4llknA1Da7uCSQB6nalQbA4gtQzf4M1YDFvdA3wDxLLO+H4pXFkHJSVIzwiaOD+lYAKoTUmXEHugVIAnLrJJiswQO77KpGPtH/I0OavoQAPEss0rLERFHr7h6Y+WbYaklppMqI/TAEADxLLN06abQk1+W4NvAk6UN+x0c9hQFcofdVbWPYMXFvEzSc2m4PwCl7hYhJD18X3M27wFAJBBVRuaB3meQsA/xLLN06faQwhhP3m1mWzvetWZCnWqpAGiVEXlgKIB4llly53MAeDiqsr4CkkoNFmOLp/TaZWb2pNJZ7LM6boSdDwKQMIvo13StSJ8Vx1hIcg8zOyXS/jm1kwC8xNmmqg/ogSEBsr+ZecLaNwMQGxHci0sTyyLsDkDlEKqMwANDAuQuZqZZJPZE6BwAzyzJpyQVnfwxM/sPh13XmZlCUXQaVqVwDwwGkLDMUsWlfRw+WhuAKs8WIyR3NjNv6eYrw37kD8U8SDVkUQ8MDRAV77zK8W5OAOABlKPrdFWS2otoT+KRGvXr8dZAuoMCJMwiyvtW/neM6Lj0oQBEyVOMkBRBt8JQ1nMatR+A45xtqnqPHigBIEpp9RA/HwhAtcWLEpIq3/BhM7u507DiDh+c9s+0+uAACbPIx81sg0hPXx1mkSKifOfbTPIFZvaGyOeYU9PzaNNeBKOk0/aZVy8FIM8zs9Mc3t4TgAIHixOSOsJ9vtOwdwOI5eBydl3Vp/FAKQC5WTjyFdl1jHzNzNYBcH2Mcp86JFcL+5HYEthz5h0O4LA+ba1jtXugCICEZdbBZnZEu8krNF4G4FiHfm+qJLVc1H7k35yDqvinGB2rFOKBkgByjzCLxJRsk/t+GKpS/aoQX65kRmLUr07ntB/5eonPtBRtKgYgYRZ5k5nt6XgRRwI4xKHfqypJ1UnfxTnohwBs6mxT1TN5oDSAiH/qM2Z2i8jn/V2YRcSNW5yQVF0ULbV0IeqRNwHQiViVgT1QFEDCLKI7DnFRxcrxAPaNVe5bj+RGASQ3do5d7B7L+RyjVi8RICKN1iyyZqRnRa2jCrlfitTvXY2kwmMUd+aVbQGc721U9bvzQHEACbOIZgRPCMbpALx3D915MaInkm8zM2+ptl+LPLuk8tgRjzpTKqUC5CZhFomtU66X8jgAImwrUkgq+1D7EW+5NtWO18mW9lu9Cck1Qk2XB5nZIzRLm9k1ZqaoB0UjXwXg270ZNNBARQIkzCL6tdWvbqycByA26DG2z071SD4xgMTb7/kAtvU2StEPMWVitdffqi19aPmnPeCnU8YaQ5tiARJAogxCT0k2LUdiCbIHeT+J8VqyNStTI0nVYzzUzJ6W4JjjtccqLco64Tlu0KR0gHjJHT4GYOMuHJOzD5KKANgvYYwsVaxI7h3AoTCZVPmume0N4JLUDkpsVzRAwizydjPbyeG8URyPkvRSB825QMwo2stMLSRFmnF44qwxafznAdAF6UzIGADyyLBhv1Gkx5XGqg170UVsSOoyVIcK3kvEH5jZEwBMdTlKUtHDJ5jZ6pF+9agVUWfSY/Ak3eIBEmYRrXG1DIiV4jfs4bl0OqRMxNvGPljQ+ziADZ1tVqiTVMnqI1PbR7bbBcCZkbrFqo0FIApk1OWhh6htZwBnFev5YBjJHczsnAQ73TntJO8egOFZsiaYtqLJRgBEsDdaGQVAwq+t9zZa/L9aav2i9LdD8kAVAE2w85UAotqRfG7YiAskfYqiHHSXM0oZDUACSHSEq5OtWCmmSlWbwSSVUanMSq/sAODcSY3CrKHjWwFkCFEJiC0B6JRrdDI2gIg15BNmdlOHp7cYy9EjyY9oA+54Nqmqsu6GC3+lSYo8QlWFxUZ/V2efi6mr2m8sVezC9pcA2KIDG3rvYlQACbOIN/PwU2Gp9c/evZswIEn90t7L2VQpyBsoHCXMGLrsE6Fd6gc9f3jdluuS8nMkxYa5m5mlpAYXHXU9yd9jBIhs1iyyvuMjOgRA7lMbhzmTVUmKxlT1Gb3h8e8LEdC6Ee9CVBVLe5wbnESRPNrMDkgYZHR1UkYHkDCLeGOa/hpmEQXZFS8kFV4zJFH3+83sFQC+MclZJE8MyzePP/UexAM2mpOtUQIkgETM8GKIj5X3AUiJM4rtv1O9KXJIprUjerZNpDhS3s7jAVw7raF9tB8zQETuoKXWwxyOOgKATnRGIVOcbKU8nz5csVZe6mlM8h1m5mXdPw5ASiyax7ROdEcLkDCLbGVm73F6YhsAFzjbDKZOUmUSHp3ZACWniQAj6Vc98fRtcy8YM/tg0e5HDZAAEi8TimKZFPA3mmQfksosvH2GD0TRCa8GcNE0fZNUyIyOqD3RwBpbJ2/FUcjO98UsAERHj1pq3cfxki8C8BSH/qCqJEVApw1ul6KQe+VwdBJpkFiS7lUAFBdWrIweIGEWeZaZeYt86pfzoGLfzALDQkLTFzuy92wAncdjkTzdzHZ12lh0vNZMACSARHXIdYnlke0BnOdpMKRuuCO50Mw8ufqTTH4WAG2wOxOSKqenpZYn7764Aq0ztcSaexiStwn53loPx4qoPrUfmXjeH9tRX3ohj0QXdYpJU43EVFHezH0A/Ca1g8XakdTSVZeWHtkHgHJTipOZmUHkWZJKt9UvmOe5LgWweXFvJsKgkBF4z1AIVb/e+tjFPHINgGtIfsvMmhjzzwWgcPtOhaT3jkr7oPVLDGj0fEidOjFXZyRfZmavdfZ/DICU0AnnMP2qk9wkJGQ1DfwcAN79W+ODhEBJVf9d1/HERXKbzRxAwkyi8O/tHC9Hqp2vyZ3jZ1En+Toze2lD5380s/t2dZo1N04ixdFWAN6bxRGJnc4qQJQUpKWWZ42uaV77EYV1z5SQ1DOJGHySvAuA9wel1UckVe9F0dexorsRLbX+Edsgt95MAiTMIlubmZhDPKIXpOSeTjeuHgNy6IaCPmJEbJIsOeQkRUyhAqexcjCAo2KVc+vNLEACSJSOqnRWj7wXgEJYZkpItvniOjN7AIAfd/ngJL1VjGWHZpEiyMhnGiABJF52RjU7FYCnkE+X31S2vkgqN7zpGDxLMVGSbzSzvRwPluV0zTH+CtWlABAlEGk/4o1lOgyASNVmRkjqVKmNR7dz4rdwwamlVmxJC/m8iEOTmQdImEVUBi2F7W83AJ7y1MWDiaRK1jUB/8/a0E9LTLfQEQmxWkoj1lJLF5qDyZIASACJd5qfeymPAHDVYG8ow8AkrzCzxzR0fSGAp3c9NEllKm7p6PdoAK9w6HeuupQAolrsF5uZl9xaoeZ3BvB/nXt/oA5JKsnsCy3Ddz57klRei5ZasTSyMvHRQ5ZXWDIACbOIwi7EPu65H1HTrwFoukcY6FNPH5akIgcU0zVJFF7/MABXp49yw5YRp2kLG2U5OIh9piUFkAASET5oJlGOhUdGG7M16SFJXmZmKjI6STrP4yd5qzCLeNhXtgPwLs/L6kp3yQEkgEQMhimb7+ITfDwfBsn7m1lbJPOeAE719NumS1K39hPZIBdp/9mw1Op9mbskARJA4g2DmHtvWwPw5sG3fTOD/XsoniP2/EmisI+1uw7BIakASSW6xcp+ADyFXWP7bdRbsgAJIEmpPKumg24cO3nz8zoh2cZ53HmKcpi9tGG/XeTziMhOfv9hpH4naksaIAEkilHaIMGba5VepCf2mUgqp0QkFk1sjp2Xf0tgtT8JwEtin6sLvSUPkAASJRmpBolX7glANKGjF5IKrRFDzCTR+n8dAJ/v6mFDdqRu9j0cwro81D1OL1IBsjwT8d/N7PfO8/m5F3QnAL/q5W1lHoSk8t2b2Cc/AEDBh50JSW+UQ5ZLzEkPVAESPBN5eTbJj7cEcH1nX81AHZFUmQQttVQ/cZJ0nj9OUkVJdfweKzsCeGes8jR6FSDzvEdyGzMT3b9bAMyELyN/0R8DQGUlOhGS4gTwlI/WMk8b9r93YkBDJzPxUrt0UsQN86Th/gpA4SyjF5JtKctKIVBiWWeZfwnHvi8H4OUecL+bCpBFXBaRxz3J0b8F4A2rd7+03A1I6hm01BKV0iTptNQzSXF9acMeWz3sl2EW0QFLNqkAmeBakgqP1wbSKz8C4Ml78Pbfiz7JHc3s7JbBVMZAtK+dSAJd0BsBvLCTwSd0UgHS4F2SujFPSb/9BoAH5nxxffRNsu0iVZvrpwFQDsnUEg4JNIuoylasdArShYNWgLS8BpKqhvT42Lc1T+9KAOsktCumSQgsVDntOzcYFV2KOubBSIqiSFRFsfJ+AE+NVfbqVYBEeIykSKM90adzvV4OIOWWPsKqflRIxrDDbAJAac1TC0nd5otdxkMhqwxIZSB2LhUgkS4lqboiKXuLqwB4XnakRf2pRZRaU9i8gjiTCvAsfBKSqljlIdbudBabb08FiOM7I6kPQLfuXvkmAIWWj1JI6mRJS62mH4hOy9uRVFGf2NrqnwGwXg7nVoA4vUqSziZz6uKbEu+UeJ9GJyT1sbZVotoCgOfCb6IfSD4hsNHE+uqOAJQe3alUgDjdSfKWZpb6kf9OgXkAfuoctgh1kieZ2YsajNGBhrL/OvlQnUVMNwTQxh7p9mMFiNtly4Ib72ZmqQyEyvV++Jhqksx3UURJhc6YSEgeZmaxVYkrQBK+5WxNSIrEYRqi61EmXUUufTphaXeWmK4Ayfa1J3ZM8nGhgGhiD7YZAMU1jUpIqgBoU51zZQqqvJ2yAJOE5AMCucNtIzu4TQ6SubrEivT+JDWSDzezaYjlRlUncc4PESUVjgPQBKJGz5PUvUZsNMKXAIjrq3OpAOnApSFl9XtTdNU5SdsUtkQ1Jbm+mV3eopxE10NSF4WeKITjAewbZbhTqQLE6bCGmUSRrzqlSpX9AXhCLFLH6awdSdXxaCqlLboezZC6ZG0Vkqua2ZUtdRUX6yfL/kMDVYC0vrZ4BZLypwL3VolvtZLmsQBUY3E0ElFS4WQAL257oMA8r2Nib05N1pi3CpC2N5fw7yRVzu1OCU3VRBQ8LwXwzcT2vTYj+Sgz00zRJI2lDEjubGZnJBr+DADeSmLRQ1WARLvKp0hSH/h9fa1WaIv7SSC5ILF9r81IvtLMjmwYVMGeWmopCWuFBFYTVb7aO9Hg0wDsltg2qlkFSJSb0pQSNpsLBzoUgBggi5eIWoRvBrDH3IOE0mzaw6RESasbxYY9MTeRXAVI5k+PZEoJuPlWibRZs8lPMps6VfckxW315ZZOdgVwBklRiE5z6qRceIGj89CShfZXgEz1WcQ1jiBBaOvo6wEkH2pTHPLfSe5vZsc02KDn+JvKKkxpZ7ZTqwqQKd9ManOSYkjfPbV9aHdKKDA6TYjLlCY0Nyf50YQiRR6b1gOge5JepM4gvbh5+SAkVbBGhWumEQU7CmynAPjWNB3laEtSBxM5TuA0+yh+7Y857J7UZwVIn95eDpLnmtmZHQz7vwJJmFGK4gcmqXuPEzt4xrku3gCgKcy+w6FW7qoCJJtrJ3cceXcQa9lv5s0oycGBsYM16ZHc1Mz0A6ACOV1JLwRxdQbp6nV11E+I3xL3VgpjymJWiHxbxAn6U+m0TpKW2h6X5OpmJmDsZGYbtuk7/l1LqRcDEPXQYFJnkMFcv2y5pdgjgUTMIV3KPwNQlCJ7ftdgCWEhYnlXuL/KSTfVFUl5LoH8IACfS2ncZZsKkC69mdhX4ILShWATq3pi78ua6b5AR8QKGlz2B0DhMK1CUpWBRQs6/+/WrQ3TFY4EcEh6825bVoB068/k3kgqvFsg2SS5E1/Dv8wHTIhEVvyYSOL037k/bzVgnxX/0lY4ysFdkT6kGrGwXQVIV57sqB+SBwegdNRj8d2orooyFI8pscZKBUiB3w/Jx4b7klheqAKfIsoklVkQMDR7FCkVIEW+luVGkdTNuy4WU+onFvxkpgI4Ssn11Eof5HkqQAZxe/yggfFcINkrw2lRvCHdaOp06m0A2soqdDNaB71UgHTgxD66CNGyqlei5KIU+tM+zJw0hiKSzwJw6ZBGpIxdAZLitQHbkLxXKOwjsDSVJRjQymVDK/zlYjM7p8/gwq4fugKka4/21B/J2wVyZ23k9efN5c5h6c9DMU4B45IuaxjmMDamzwqQGC8VrkNyjXlgUejKzXs0WYlcuogUabVAoSDKmZEKkJl5lcsfhORqIb5LhXsEltSU1kk2kDndAAAASElEQVSeESBUJk1/nwLQRtgwag9XgIz69bUbH4gRFC4y96d8DdX5ULjI3N+tzEw35gp4/EP4m/v/uf+KcOGKhcQL7RaMW+P/AZ5OQV+cbZPKAAAAAElFTkSuQmCC" width="18" height="18" />&nbsp;客服电话: 0731-84423475&nbsp;&nbsp;</p>
							<p class="contact-bottom"><i class="layui-icon layui-icon-cellphone"></i>&nbsp;商务合作: 18511372161&nbsp;&nbsp;</p>
							<p class="contact-bottom"><i class="layui-icon layui-icon-home"></i>&nbsp;269192861@qq.com</span></p>
							<p class="contact-bottom"><span class="right">版权所有<a href="https://www.sovitjs.com/" target="_blank"> 长沙数维图信息科技有限公司</a></span></p>
							<p class="contact-bottom"><span class="right">Copyright&nbsp;©&nbsp;2020-2021&nbsp;&nbsp;<a href="http://www.beian.miit.gov.cn" target="_blank">湘ICP备20011773号</a></span></p>
						</div>-->
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="layui-container">
		<div style="padding-top: 60px;padding-bottom: 30px;color: #C2C2C2;border-bottom: 1px solid #DEDEDE;">合作伙伴:飞利迅 &nbsp;&nbsp;&nbsp;&nbsp;欧远致</div>
		<div style="padding-top: 20px;padding-bottom: 30px;color: #C2C2C2;text-align: center;">
			<span>版权所有<a href="https://www.sovitjs.com/" target="_blank" style="color: #C2C2C2;"> 长沙数维图信息科技有限公司</a></span> Copyright&nbsp;©&nbsp;2020-2022&nbsp;&nbsp;
			<a href="http://www.beian.miit.gov.cn" style="color: #C2C2C2;" target="_blank">湘ICP备20011773号</a>
			</span>
		</div>
	</div>
</div>
	</body>

</html>
<script>
	let sceneMain = null;
	let sovitMouseoverTimer2 = null;
	let isInDiv = false;
	$(document).ready(function() {
		//iframe中加载模型
		$("#demo_iframe").attr("src", " https://admin.sovitjs.com/publish_2d/2951566629932105737");
		//写一个方法用来监听模型事件回调
		window.onmessage = handleIframeMessage;

		//测试用的弹出框实现
		$(document).on('mouseover', ".test_click_div", function(ev) {
			clearTimeout(sovitMouseoverTimer2);
			isInDiv = true;
			$(".test_click_div").show()
		}).on("mouseout", ".test_click_div", function(e) {
			$(".test_click_div").hide();
			isInDiv = false;
		});
		
		$(".test_click_div").click(function(){
			alert('被点击的值是:'+$(this).attr("id"));
		})
	});

	//自定义方法用来接收模型中的事件
	function handleIframeMessage(event) {
		//接收到的事件中包含的数据
		const data = event.data
		switch(data.cmd) {
			case 'EventCallback'://EventCallback是定义好的事件回调名,必须这样写
				if(data.params.success) {
					console.info(data)//打印出来看看
					let reJson = data.params.data.props;
					if(data.params.data.type == 1) {//type代表事件类型:1单击  2双击  3鼠标移入  4鼠标移出
						let textValue = "";
						//textAttrs代表模型中发生事件的组件的文本对象
						//objectAttrs代表模型中发生事件的组件对象
						if(data.params.data.textAttrs != undefined) {
							textValue = data.params.data.textAttrs.text;
						}
						alert("点击事件回调测试:"+textValue);
					}if(data.params.data.type == 3) {//鼠标移入
						clearTimeout(sovitMouseoverTimer2);
						if($(".test_click_div").is(':hidden')) {
							$(".test_click_div").show()
							let textValue = "";
							if(data.params.data.textAttrs != undefined) {
								textValue = data.params.data.textAttrs.text;
							}
							$(".test_click_div").css('left', data.params.data.objectAttrs.x / 2 + 25)
							$(".test_click_div").css('top', data.params.data.objectAttrs.y / 2 - 20)
							$(".test_click_div").attr("id",textValue);
						}
					} else if(data.params.data.type == 4) {//鼠标移出
						sovitMouseoverTimer2 = setTimeout(function() {
							if($(".test_click_div").is(':visible') && isInDiv==false) {
								$(".test_click_div").hide()
							}
						},500);
					}
				} else {
					console.info("事件数据获取失败")
				}
				break;
		}
	}
	function doClick(vaue) {
		alert(vaue);
	}
</script>
效果预览:
通过Sovit2D后台编辑器制作好的模型。这里用来测试如何利用事件回调进行组件的事件开发操作。
请在下面模型中进行事件回调测试,Ua和弹簧未储能可测试鼠标移入移出测试,Ub可测试点击事件。
要实现组件事件回调请在模型编辑器中的事件页签中给组件添加事件。
查看曲线

通过数维图软件平台,实现零代码可视化开发!

免费开发我的场景