關於在Raphael.js中添加樣式到Manu路徑的問題

使用Raphael.js我有一個帶有250個路徑的文檔（稱爲地圖）。他們都出現在紙上，但在造型上我有一些問題。我用關於在Raphael.js中添加樣式到Manu路徑的問題

map.attr({fill: "grey",stroke: '#FFF','stroke-width': .5});

風格的所有路徑，但它只是風格化的第一條路徑！？這裏是我生成篾的方式

var map = paper.path(["M466.32309,424.29005L465.84309,424.29005 L465.36309423.33012L465.60309,z"]); 
var map = paper.path(["M453.60301,407.97121L454.08301,408.93114 L454.08301,407.73122L455.52302,408.21119L45.00303,410.61102 ,z"]); 
var map = paper.path(["M435.84289,397.65193L435.60289,397.65193 L435.84289,397.89192L435.84289,397.65193L436.32289,z"]); 

map.attr({fill: "grey",stroke: '#FFF','stroke-width': .5});

能否請你讓我知道如何通過所有pathes的循環，並添加相同的風格呢？

謝謝

來源

2014-07-07 user3668817

這看起來不太正確。你每次都會覆蓋'地圖'，所以我會假設它實際上是最後一個樣式化的路徑？

想到幾個可能的選擇。

1）你可以將每個元素推入Raphael集。 (Raph set docs here)。然後，您可以將樣式應用於集合（這將應用於每個元素）。稍後，如果您還需要執行其他任何操作（如添加處理程序），則可以遍歷該集合。

2）你可能會給每個元素一個類，然後風格？或者甚至根據情況將樣式應用於每個路徑元素。 3）您可以將map中的每個元素存儲在一個數組mapArray中，然後您可以使用傳統的循環遍歷該數組。這感覺有點笨拙，但應該仍然正常工作。

在jsfiddle中包含一個示例以獲得更具體的解決方案將是有用的。

來源

2014-07-08 09:51:18 Ian

這就是我該怎麼做的。與Ian「1°）相同的原則」，但我會添加一個完成所有工作的函數，因爲它看起來覆蓋了250次地圖。

  var momentaryPath; 
      var arrayTotal; 
      var paper = Raphael("paper1", 1060,610); 
      arrayTotal=paper.set(); 

      function map(path){ 
       momentaryPath=paper.path(path); 
       arrayTotal.push(momentaryPath); 
      } 

      function draw(){ 

         map("M10 10 l150 150 v150 l150z"); 
         map("M350 350 l-150 -150 v-50z"); 

         arrayTotal.attr({fill: "grey",stroke: '#FFF','stroke-width': .5}); 
      } 
      draw();

使用函數，還可以選擇使用參數中的字符串更改每個路徑的顏色。像這樣的：

function map(path,color){ 
       momentaryPath=paper.path(path).attr({fill : color}); 
       arrayTotal.push(momentaryPath); 
      }

你也可以設置一個基本的顏色，並最終改變它，這是你的選擇。希望幫助:)

來源

2014-07-09 16:05:11 Vidup

關於在Raphael.js中添加樣式到Manu路徑的問題

回答

相關問題