简体   繁体   English

在raphael.js文件上缩放和定位新的路径元素

[英]Scaling and positioning a new path element on a raphael.js paper

I have a world map using raphael.js with a few countries highlighted using paths. 我有一个使用raphael.js的世界地图,其中一些国家使用路径突出显示。 My client has asked that I add China as a highlighted country. 我的客户要求我将中国添加为突出显示的国家。 I located another raphael.js map with China in it and imported the coordinates. 我找到了另一个包含中国的raphael.js地图,并导入了坐标。

It worked fine except that the position of the vector and it's size are not correct for the world map I am using. 除矢量的位置及其大小对于我正在使用的世界地图不正确外,它工作得很好。 The z-index appears to also need to be increased. Z索引似乎也需要增加。

I can bring element up by calling thismap.world.cn.toFront(); 我可以通过调用thismap.world.cn.toFront();元素thismap.world.cn.toFront(); after it is drawn but the other elements do not require this so I am assuming I can adjust z-index with a coordinate edit? 在绘制之后,但其他元素不需要这样做,所以我假设我可以通过坐标编辑来调整z-index?

Is it possible to manually scale and position the element? 是否可以手动缩放和定位元素? Are there GUI tools for manipulating the coordinates or do I need to use scale() in raphael.js to manipulate the element? 是否有用于操纵坐标的GUI工具,或者我需要在raphael.js中使用scale()来操纵元素?

Coords look like 坐标看起来像

cn: "M777.533,179.567l-2.325,1.451l-2.326-0.871v-2.323l1.163-1.453l3.196-0.581h1.455l0.581,0.872l-1.163,1.451L777.533,179.567zM825.204,94.194l4.651,0.871l3.488,1.742l0.871,2.614h4.361l2.325-0.872l4.651-0.871l-1.454,2.323l-1.163,1.162l-0.871,2.904l-2.034,2.613l-3.198-0.291l-2.325,0.871l0.581,2.324l-0.29,3.194l-1.454,0.291v1.161l-1.744-1.451l-1.163,1.451l-4.067,1.162l0.289,1.453h-2.325l-1.452-0.872l-1.745,2.032l-3.198,1.453l-2.033,1.742l-3.781,0.871l-2.033,1.162l-3.197,0.871l1.452-1.453l-0.58-1.16l2.325-1.742l-1.455-1.453l-2.324,1.162l-3.197,1.742l-1.745,1.742l-2.615,0.291l-1.452,1.16l1.452,1.743l2.326,0.581v1.162l2.325,0.872l2.906-2.033l2.616,1.162h1.744l0.289,1.452l-3.777,0.871l-1.454,1.452l-2.615,1.453l-1.453,1.742l3.196,1.742l0.872,2.614l1.743,2.613l1.745,2.033v2.033l-1.745,0.581l0.873,1.453l1.455,0.87l-0.292,2.324l-0.873,2.323h-1.452l-2.034,3.194l-2.326,3.484l-2.327,3.195l-3.778,2.613l-4.069,2.323l-2.905,0.291l-1.744,1.162l-0.873-0.871l-1.743,1.452l-3.779,1.451l-2.906,0.291l-0.872,2.904l-1.454,0.29l-0.873-2.033l0.584-1.162l-3.488-0.872l-1.455,0.581l-2.615-0.87l-1.454-0.873l0.581-1.742l-2.615-0.581l-1.452-0.871l-2.328,1.451l-2.615,0.291h-2.034l-1.454,0.58l-1.453,0.582l0.29,2.903h-1.455l-0.289-0.581v-1.161l-2.034,0.87l-1.163-0.581l-2.035-1.162l0.872-2.033l-1.743-0.581l-0.873-2.613l-2.905,0.58l0.29-3.484l2.615-2.323l0.291-2.033l-0.291-2.323l-1.161-0.581l-0.873-1.452h-1.455l-3.194-0.291l1.161-1.161l-1.455-1.743l-2.034,1.162l-2.033-0.581l-3.198,1.742l-2.615,2.033l-2.326,0.29l-1.162-0.872h-1.453l-2.035-0.58l-1.454,0.58l-1.743,2.033l-0.292-2.033l-1.744,0.582L713,154.013l-2.906-0.581l-2.326-1.162l-2.034-0.581l-1.162-1.452l-1.454-0.291l-2.615-1.742l-2.326-0.871l-1.162,0.581l-3.781-2.033l-2.615-1.742l-0.873-2.904l2.036,0.291v-1.453l-1.163-1.161l0.293-2.324l-2.908-3.194l-4.361-1.161l-0.87-2.033l-2.036-1.451l-0.58-0.582l-0.292-1.742v-1.161l-1.743-0.582l-0.874,0.291l-0.579-2.324l0.579-0.871l-0.289-0.581l2.615-1.162l2.036-0.58l2.906,0.291l0.871-1.744l3.489-0.29l1.162-1.162l4.362-1.451l0.289-0.581l-0.289-1.743l2.033-0.581l-2.617-4.646l5.524-1.162l1.452-0.58l2.034-4.938l5.232,0.873l1.744-1.162v-2.904l2.328-0.291l2.033-1.742l1.163-0.29l0.581,2.032l2.326,1.452l4.067,0.872l1.746,2.323l-0.873,3.194l0.873,1.162l3.197,0.582l3.778,0.29l3.488,1.742l1.743,0.291l1.163,2.613l1.455,1.453h3.196l5.522,0.58l3.78-0.291l2.615,0.291l4.069,1.743h3.489l1.162,0.871l3.197-1.451l4.361-0.873l4.359-0.29l3.198-0.871l1.745-1.452l2.033-0.871l-0.581-0.872l-0.873-1.161l1.454-1.742l1.745,0.29l2.614,0.581l2.908-1.452l4.069-1.162l2.034-1.742l2.035-0.872l4.07-0.29l2.034,0.29l0.291-1.162l-2.325-1.741l-2.326-0.872l-2.036,0.872l-2.904-0.291l-1.455,0.291l-0.581-1.162l1.744-2.613l1.453-2.324l3.197,1.162l4.068-1.742v-1.162l2.328-2.903l1.452-0.872v-1.452l-1.452-0.871l2.325-1.162l3.486-0.58h3.491l4.067,0.58l2.617,1.162l1.744,2.903l0.871,1.161l0.874,1.453L825.204,94.194z",

And current map with China drawn looks like: 当前绘制的中国地图如下所示:

中国

The answer is to use the translate(x,y) method eg 答案是使用translate(x,y)方法,例如

thismap.world.cn.translate(300, 100) ; thismap.world.cn.translate(300, 100) ;

and the scale() method. 和scale()方法。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM