900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > krpano实现多语言切换

krpano实现多语言切换

时间:2021-02-23 20:14:38

相关推荐

krpano实现多语言切换

最近做项目遇到的需求,在全景图里实现中英文切换。然后自己就想了这么一套方案

1. 首先创建我们的语言包

这里在根目录下创建

中文语言包lange_cn.xml

<krpano><set_langescene1_name="企业文化大厅"scene2_name="样品展厅1"scene3_name="样品展厅2"hotspot1_name="新款"hotspot2_name="官网链接"hotspot3_name="塑料水壶系列"hotspot4_name="玻璃水壶系列"hotspot5_name="不锈钢系列"/><include url="tour.xml" /></krpano>

中文语言包lange_en.xml

<krpano><set_langescene1_name="Honor room"scene2_name="Show Room 1"scene3_name="Show Room 2"hotspot1_name="NEW MODEL"hotspot2_name="Official Webiste"hotspot3_name="Plastic kettle series"hotspot4_name="Glass kettle series "hotspot5_name="Stainless steel kettle series"/><include url="tour.xml" /></krpano>

这里我们设置了set_lange元素来承载我们的语言属性。

2. 在tour.xml调用我们的语言属性

<scene title="get:set_lange.scene1_name" >

get:set_lange.scene1_name就是我们调用语言属性的代码,其他地方一样。关于krpano的语法可以到

/

/46046.html

学习相关的知识。

3. 在html里设置入口文件

正常情况下我们的tour.html里是这样的

embedpano({swf: "tour.swf",xml: 'tour.xml',target: "pano",html5: "auto",mobilescale: 1.0,passQueryParameters: true});

这里就是渲染我们场景的js代码。这里我们需要改动一下,将xml: 'tour.xml'设置动态值(引入我们的语言包文件lange_cn.xml 和lange_en.xml)

比如我们用本地存储(localStorage)来记录我们当前的语言。

var tour_xml = 'lange_en.xml';if(localStorage.getItem('lange') == 0){tour_xml = 'lange_cn.xml'}embedpano({swf: "tour.swf",xml: tour_xml,target: "pano",html5: "auto",mobilescale: 1.0,passQueryParameters: true});

到这里就基本完成了,至于怎样切换中英文这个就不用多说了,无非就是一个点击事件。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。