我正在嘗試使用Raphael在網頁中創建類似於此example的地圖工具。使用raphael縮放多個路徑
我有我想使用的地圖的svg文件,而省份都是文件中的單獨路徑。但是,如果我將svg文件的座標直接複製到拉斐爾路徑,則圖像太大而不適合屏幕,因此我需要對其進行縮放。
我知道我可以使用比例函數來單獨縮放所有省份的路徑,但之後它們將不再接觸對方,我必須移動它們以重新組裝地圖。
有沒有辦法將路徑分組在一起並縮放整個事物,還是有一些巧妙的工具來縮放原始svg文件? Inkscape縮放看起來不會修改svg文件中的座標。
謝謝。
來源:
window.onload=function(){
var paper = new Raphael(document.getElementById('canvas_container'),2000,4000);
var province = {}
province.a = paper.path("M 1195.23,2765.05 1176.44,2753.8 1182.93,2743.86 1198.21,2745.13 1201.92,2738.14 1239.79,2738.32 1263.62,2752.62 1284.76,2743.95 1317.8,2750.74 1367.35,2746.42 1392.66,2715.11 1400.21,2696.4 1414.4,2707.23 1451.71,2707 1456.53,2690.06 1486.98,2691.43 1517.68,2681.6 1536.64,2650.12 1560.81,2641.94 1566.44,2625.91 1655.76,2577.95 1652.86,2580.91 1640.92,2614.69 1610.92,2642.31 1590.74,2684.67 1565.32,2702.68 1559.58,2720.44 1521.84,2784.07 1477.67,2814.72 1461.87,2821.15 1442.9,2853.64 1440.5,2874.94 1420.09,2879.49 1381.85,2912.96 1374.51,2932.58 1336.52,2969.11 1318.56,2959.93 1310.72,2940.64 1294.49,2938.23 1287.2,2923.45 1265.55,2923.98 1246.43,2913.8 1239.54,2901.7 1213.98,2894.24 1206.33,2881.17 1214.32,2876.4 1199.89,2858.79 1204.99,2841.58 1220.87,2835.67 1210.72,2812.63 1232.15,2807.48 1225.15,2793.26 1231.23,2781.47 1213.41,2762.4 1195.23,2765.05 z");
province.b = paper.path("M 1050.73,2867.78 1046.35,2845.33 1040.53,2832.74 1044.23,2819.35 1066.03,2819.42 1087.07,2805.18 1094.97,2784.45 1104.23,2779.31 1115.05,2774.95 1131.12,2800.44 1146.19,2792.66 1146.45,2777.1 1166.57,2777.52 1166.63,2804.27 1194.54,2818.11 1210.74,2812.67 1220.87,2835.67 1204.99,2841.58 1199.89,2858.79 1214.32,2876.4 1206.33,2881.17 1213.98,2894.24 1239.54,2901.7 1246.43,2913.8 1265.55,2923.98 1287.2,2923.45 1294.49,2938.23 1310.72,2940.64 1318.56,2959.93 1336.52,2969.11 1320.71,2984.32 1320.22,2994.45 1309.88,3001.29 1297.83,2993.4 1293.02,2997.09 1289.27,3013.92 1283.96,3022.6 1275.93,3022.85 1266.2,3024.26 1259.83,3020.74 1253.98,3024.67 1246.93,3031.3 1237.88,3017.88 1214.41,3015.12 1185.95,3005.82 1174.43,3017.4 1174.77,3035.97 1170.62,3043.42 1158.95,3043.06 1145.56,3029.7 1137.74,3036.82 1127.73,3037.17 1121.47,3030.56 1114.84,3035.16 1101.49,3035.03 1102.89,3011.96 1123.59,2990.26 1137.04,2989.94 1130.85,2973.55 1120.31,2972.88 1114.08,2984.93 1100.47,2983.63 1095.19,2970.61 1085.65,2970.31 1077.68,2950.18 1061.43,2942.38 1057.59,2940.54 1055.36,2924.83 1041.79,2915.84 1041.19,2898.89 1048.93,2884.2 1032.89,2877.32 1038.29,2867.02 1050.73,2867.78 z");
province.a.scale(.5, .5);
province.b.scale(.5, .5); }
難道你不應該在你身上有其他字母嗎? 「,」代表「L」嗎? – 2010-07-28 13:12:57
The,只分隔x和y座標,但如果座標對之間沒有字母,代碼似乎將默認放在L中。如果我替換字符串的效果是相同的: M 1195.23,2765.05 L 1176.44,2753.8 L 1182.93,2743.86 ... ... – Keppo 2010-07-29 05:37:04