2015-11-29 144 views
-1

我想變形爲svg中非常複雜的形狀。 它們由多條路徑組成。 它甚至有可能嗎?如何變形複雜的svg形狀

我已經tryed是這樣的:

<animate attributeName="points" dur="500ms" to="M134.596,71.345c0.528,0.61,1.14,0.854,1.872,0.854c2.034,0,3.337-1.75,3.337-4.11 
    c0-1.39-0.447-2.388-1.121-3.103c-1.497-1.587-4.112-1.781-5.431-1.781c-1.176,0-2.296,0.153-3.327,0.438 
    c-1.031,0.285-1.973,0.702-2.791,1.23c-0.95,0.613-1.733,1.376-2.296,2.256c-0.633,0.988-0.987,2.124-0.987,3.36 
    c0,0.583,0.079,1.132,0.223,1.656c0.075,0.277,0.168,0.546,0.277,0.81c0.345,0.833,0.845,1.606,1.428,2.351 
    c0.316,0.404,0.657,0.801,1.011,1.194c0.952,1.061,1.999,2.103,2.915,3.236c1.396,1.725,2.489,3.657,2.489,6.177 
    c0,0.744-0.094,1.42-0.27,2.023c-0.32,1.097-0.909,1.951-1.689,2.527c-0.762,0.563-1.707,0.862-2.762,0.862 
    c-0.791,0-1.462-0.173-2.013-0.47c-0.501-0.271-0.902-0.645-1.205-1.086c-0.459-0.671-0.688-1.497-0.688-2.352 
    c0-0.85,0.235-1.535,0.624-2.078c0.447-0.626,1.099-1.063,1.83-1.343c0.73-0.28,1.541-0.404,2.307-0.404 
    c-0.122-2.116-2.156-2.686-3.581-2.686c-1.118,0-2.281,0.352-3.281,1.045c-0.773,0.536-1.448,1.276-1.93,2.216 
    c-0.482,0.939-0.771,2.078-0.771,3.413c0,0.636,0.065,1.223,0.189,1.764c0.24,1.05,0.699,1.927,1.327,2.644 
    c0.628,0.718,1.425,1.275,2.34,1.686c1.382,0.62,3.031,0.906,4.772,0.906c2.182,0,4.313-0.456,6.134-1.377 
    c1.293-0.654,2.429-1.543,3.314-2.668c0.711-0.903,1.26-1.959,1.599-3.17c0.253-0.9,0.389-1.887,0.389-2.959 
    c0-3.117-1.151-5.231-2.638-6.928c-1.269-1.448-2.78-2.593-4.029-3.799c-1.414-1.365-2.49-2.809-2.49-4.859 
    c0-2.442,1.506-3.704,3.744-3.704s3.012,1.302,3.012,2.727C136.427,69.188,135.694,70.694,134.596,71.345z,M147.661,71.183c1.791,0,3.256-1.424,3.256-3.215c0-1.791-1.465-3.255-3.256-3.255 
    s-3.215,1.465-3.215,3.255C144.446,69.758,145.87,71.183,147.661,71.183z,M189.499,90.024c-1.221,0-1.628-0.691-1.628-1.709c0-0.98,0.361-2.45,0.773-4.069 
    c0.307-1.204,0.641-2.49,0.875-3.72c0.183-0.961,0.305-1.887,0.305-2.71c0-2.2-0.873-3.527-2.243-4.156 
    c-0.657-0.302-1.429-0.443-2.273-0.443c-0.631,0-1.394,0.082-2.213,0.407c-0.819,0.326-1.694,0.896-2.549,1.872l0.448-2.116h-2.327 
    h-1.833h-1.7l-0.469,2.216l-0.237,1.116l-0.891,4.2l-0.731,3.451l-0.441,2.08l0,0c-1.14,3.54-2.646,4.924-5.128,5.819l1.408-6.601 
    l0.797-3.733l0.746-3.495l1.078-5.054h-5.86l-0.447,2.116v-0.244c0-1.18-0.978-2.076-3.297-2.076c-1.982,0-3.675,0.686-5.084,1.795 
    c-1.29,1.015-2.343,2.383-3.164,3.904c-1.484,2.751-2.21,5.998-2.21,8.545c0,0.09,0.014,0.164,0.016,0.252 
    c-0.27,0.506-0.588,0.961-0.953,1.326c-0.641,0.641-1.404,1.026-2.197,1.026c-1.14,0-1.669-0.366-1.669-1.506 
    c0-0.366,0.041-0.773,0.163-1.302l2.93-13.837h-5.86l-2.767,13.063c-0.204,0.977-0.326,1.872-0.326,2.646 
    c0,1.472,0.354,2.582,0.954,3.368c0.792,1.04,2.011,1.515,3.4,1.515c1.099,0,2.655-0.224,4.228-1.276 
    c0.837-0.561,1.676-1.367,2.454-2.489c0.222,0.737,0.53,1.356,0.911,1.858c1.03,1.358,2.56,1.907,4.129,1.907 
    c2.116,0,3.703-0.977,4.883-2.238l-0.488,2.157c-3.052,0.936-6.633,2.646-6.633,6.063c0,2.645,2.075,3.947,4.558,3.947 
    c1.618,0,3.501-0.397,5.009-1.985c0.605-0.638,1.151-1.467,1.596-2.54c0.286-0.691,0.53-1.484,0.721-2.393l0.61-2.93 
    c1.412-0.388,3.003-1.044,4.408-2.487l-0.139,0.655l-0.319,1.506h5.859l0.634-2.994l0.63-2.973l0.854-4.03l0.649-3.065 
    c0.61-2.035,1.709-3.745,3.175-3.745c0.977,0,1.465,0.732,1.465,2.076c0,0.737-0.146,1.667-0.356,2.684 
    c-0.175,0.842-0.393,1.743-0.606,2.645c-0.148,0.623-0.295,1.247-0.424,1.851c-0.256,1.194-0.444,2.312-0.444,3.198 
    c0,0.802,0.117,1.6,0.399,2.3c0.317,0.789,0.846,1.454,1.654,1.862c0.549,0.277,1.227,0.437,2.056,0.437 
    c0.865,0,1.697-0.203,2.407-0.635c0.603-0.367,1.117-0.898,1.49-1.611c0.283-0.542,0.484-1.188,0.579-1.945 
    C190.598,89.943,190.191,90.024,189.499,90.024z M160.359,97.105c-0.2,0.909-0.465,1.649-0.763,2.218 
    c-0.489,0.933-1.067,1.404-1.598,1.404c-0.896,0-1.384-0.773-1.384-1.344c0-0.814,0.479-1.486,1.218-2.051 
    c0.737-0.563,1.733-1.021,2.771-1.407L160.359,97.105z M163.979,80.055l-0.875,4.063l-0.588,2.733 
    c-0.569,2.075-2.156,3.174-3.255,3.174c-0.733,0-2.035-0.041-2.035-3.174c0-3.825,2.238-11.151,5.697-11.151 
    c1.303,0,1.628,1.058,1.669,1.505L163.979,80.055z,M81.583,70.477c0-3.052-1.343-5.86-4.802-6.552c0.674-0.383,1.268-0.835,1.78-1.336 
    c0.996-0.974,1.679-2.131,2.025-3.323c0.175-0.602,0.264-1.212,0.264-1.812c0-1.491-0.536-2.94-1.662-4.088 
    c-0.375-0.383-0.816-0.732-1.325-1.038c-0.678-0.408-1.476-0.74-2.398-0.971c-0.958-0.24-2.051-0.373-3.283-0.373 
    c-0.607,0-1.21,0.032-1.807,0.094c-1.187,0.124-2.345,0.366-3.451,0.708c-0.83,0.256-1.629,0.569-2.389,0.93 
    c-0.323,0.153-0.638,0.315-0.945,0.486c-0.796,0.442-1.539,0.938-2.213,1.479c-0.547,0.439-1.049,0.907-1.499,1.4 
    c-0.398,0.436-0.754,0.89-1.065,1.359c-0.377,0.57-0.687,1.163-0.917,1.77c-0.315,0.831-0.485,1.689-0.485,2.559 
    c0,0.937,0.197,1.672,0.565,2.234c0.277,0.423,0.651,0.747,1.11,0.985c0.705,0.365,1.612,0.525,2.679,0.525 
    c-0.041-0.366-0.57-0.692-0.57-2.767c0-1.822,0.398-3.383,1.074-4.691c0.47-0.91,1.075-1.698,1.773-2.365 
    c1.996-1.908,4.756-2.833,7.327-2.833c3.866,0,5.372,2.076,5.372,4.395c0,3.052-2.604,6.593-5.86,6.593h-0.244l0.55-2.602 
    l0.231-1.092l0.427-2.015l0.292-1.378l0.413-1.948l-3.161,0.427l-2.862,0.387l-0.399,1.869l-1.168,5.464l-0.348,1.628l-1.429,6.682 
    l-0.45,2.105l-0.971,4.542l-0.769,3.592h2.176h3.684l0.8-3.735l0.651-3.039l0.473-2.208l0.624-2.914l0.79-3.691 
    c0.732-0.081,1.546-0.122,1.872-0.122c2.69,0,3.678,1.903,3.841,4.378c0.017,0.258,0.025,0.522,0.025,0.791 
    c0,0.976-0.105,2.065-0.343,3.1c-0.515,2.243-1.652,4.226-3.686,4.226c-0.936,0-1.709-0.407-2.727-1.465 
    c-0.366,0.936-0.529,1.709-0.529,2.361c0,2.482,2.279,3.012,4.029,3.012C79.467,82.197,81.583,74.383,81.583,70.477z,M121.274,73.618l0.652-3.063l0.368-1.73l1.785-8.379l0.478-2.243l1.104-5.185l-6.023,0.814l-1.994,9.36 
    v-0.163c0-1.18-0.977-2.076-3.296-2.076c-2.508,0-4.551,1.098-6.145,2.76c-1.478,1.541-2.568,3.566-3.283,5.651 
    c-0.691,2.016-1.031,4.088-1.031,5.833c0,0.137,0.01,0.262,0.014,0.393c-0.643,1.404-1.569,2.456-2.783,2.456 
    c-1.14,0-1.668-0.61-1.668-1.75c0-0.366,0.041-0.773,0.163-1.302l2.93-13.836h-5.86l-0.447,2.157v-0.285 
    c0-1.18-0.977-2.076-3.296-2.076c-3.107,0-5.501,1.685-7.209,4.04c-2.185,3.012-3.249,7.121-3.249,10.204 
    c0,1.408,0.224,2.551,0.609,3.465c0.939,2.228,2.841,3.087,4.803,3.087c2.89,0,4.802-1.872,6.063-3.744 
    c0.068,0.683,0.232,1.275,0.482,1.776c0.645,1.291,1.864,1.968,3.506,1.968c1.675,0,4.2-0.528,6.333-3.714 
    c0.831,2.689,2.888,3.714,5.022,3.714c2.686,0,4.558-1.628,5.779-3.377c0.488,2.359,2.157,3.377,4.232,3.377 
    c2.197,0,4.273-1.302,4.477-4.191c-0.244,0.122-0.569,0.244-1.302,0.244c-1.262,0-1.669-0.692-1.669-1.628 
    c0-0.366,0.081-0.773,0.163-1.18L121.274,73.618z M93.917,74.22c-0.488,2.36-2.197,3.582-3.377,3.582 
    c-0.733,0-2.035-0.041-2.035-3.174c0-0.957,0.14-2.131,0.403-3.356c0.169-0.786,0.39-1.592,0.657-2.374 
    c0.267-0.782,0.581-1.54,0.938-2.229c0.955-1.843,2.214-3.192,3.699-3.192c1.302,0,1.668,1.058,1.668,1.546L93.917,74.22z 
    M115.121,74.872c-0.447,1.994-2.116,2.93-3.174,2.93c-0.733,0-2.035-0.041-2.035-3.174c0-3.825,2.238-11.15,5.698-11.15 
    c1.221,0,1.587,0.936,1.668,1.424L115.121,74.872z,M80.768,51.467c-0.017-0.148-0.231-0.264-0.231-1.14c0-1.983,1.124-3.321,2.925-3.801l-0.545,2.181 
    c-0.694,2.793-1.355,5.106-1.355,6.743c0,1.669,0.81,2.627,3.189,2.627c1.91,0,3.091-0.606,3.932-1.876 
    c0.39-0.588,0.706-1.32,0.988-2.199c0.294-0.918,0.551-1.998,0.814-3.245l0.715-3.38l0.375-1.775h-2.33l-0.73,3.367l-0.377,1.74 
    c-0.451,2.078-0.819,3.408-1.182,4.258c-0.58,1.361-1.144,1.493-2.008,1.493c-0.826,0-1.14-0.545-1.14-1.487 
    c0-0.694,0.173-1.599,0.539-3.042s0.923-3.427,1.691-6.278c-0.347-0.066-0.512-0.083-0.793-0.083c-3.206,0-6.247,2.049-6.247,4.379 
    C79,51.054,79.678,51.467,80.768,51.467z,M90.896,54.706l-0.69,3.255h2.379l0.375-1.768l0.509-2.402l0.241-1.135c0.248-0.826,0.694-1.52,1.289-1.52 
    c0.396,0,0.595,0.297,0.595,0.843c0,1.058-0.744,3.09-0.744,4.214c0,0.942,0.512,1.867,1.95,1.867c0.661,0,1.547-0.201,2.34-1.462 
    c0.347,1.057,1.169,1.462,2.023,1.462c1.173,0,1.95-0.76,2.446-1.521c0.132,0.926,0.727,1.421,1.62,1.421 
    c0.681,0,1.707-0.158,2.574-1.426c0.341,1.065,1.219,1.525,2.418,1.525c1.647,0,2.849-0.863,3.745-1.936l-0.39,1.837h2.379 
    l1.322-6.28c0.413-0.38,0.71-0.628,1.207-0.628c0.496,0,0.033,1.091,0.958,1.091c0.81,0,1.19-0.628,1.19-1.207 
    c0-0.628-0.396-1.239-1.14-1.239c-0.793,0-1.421,0.529-2,1.024l0.215-1.024h-2.38l-1.125,5.305 
    c-0.826,0.942-1.62,1.668-2.924,1.668c-0.793,0-1.19-0.264-1.19-1.388c0-0.198,0.017-0.43,0.033-0.661 
    c1.983-0.116,3.801-1.586,3.801-3.487c0-0.827-0.347-1.586-1.818-1.586c-3.388,0-4.462,3.982-4.462,5.883 
    c0,0.039,0.007,0.069,0.008,0.107c-0.261,0.546-0.638,0.917-1.132,0.917c-0.463,0-0.678-0.148-0.678-0.611 
    c0-0.149,0.017-0.314,0.066-0.529l0.622-2.917l0.223-1.049l0.274-1.285l0.516-2.425l0.266-1.247l-2.445,0.331l-0.81,3.801v-0.066 
    c0-0.479-0.396-0.843-1.338-0.843c-2.875,0-4.247,3.553-4.247,5.784c0,0.023,0.004,0.041,0.004,0.063 
    c-0.287,0.599-0.594,0.995-1.179,0.995c-0.496,0-0.661-0.281-0.661-0.694c0-0.463,0.199-1.194,0.397-1.977s0.396-1.618,0.396-2.287 
    c0-0.661-0.194-1.128-0.521-1.43c-0.327-0.301-0.785-0.438-1.314-0.438c-0.512,0-1.239,0.132-1.933,0.925l0.182-0.859h-2.38 
    l-0.513,2.421L90.896,54.706z M112.236,50.426c0.314,0,0.413,0.265,0.413,0.678c0,1.372-1.124,2.644-2.396,2.727 
    C110.583,52.194,111.394,50.426,112.236,50.426z M101.469,54.402c0.091-0.662,0.288-1.419,0.572-2.08 
    c0.403-0.938,0.981-1.682,1.684-1.682c0.496,0,0.645,0.38,0.678,0.579l-0.81,3.784v0.083c-0.215,0.909-0.892,1.372-1.355,1.372 
    c-0.297,0-0.826-0.017-0.826-1.289C101.411,54.939,101.431,54.679,101.469,54.402z,M53.918,80.987c1.168,0,1.958-0.773,2.451-1.53c0.131,0.954,0.724,1.53,1.612,1.53s1.201-0.51,1.645-1.661 
    c-0.115,0.049-0.214,0.065-0.362,0.065c-0.46,0-0.674-0.148-0.674-0.608c0-0.148,0.016-0.313,0.065-0.526l0.255-1.205l0.468-2.209 
    l0.236-1.116l0.225-1.063h-2.369l-0.181,0.872v-0.115c0-0.477-0.395-0.839-1." /> 

是否點從許多路徑結合起來,但是,這並不工作,它甚至不顯示任何東西

回答

1

您指定points屬性(這是一個<polygon>元素),但你傳遞一個<path>描述(這應該是一個d)。

因此,首先,您需要更改attributeNameto,具體取決於您嘗試設置動畫的元素。

此外,動畫路徑的動畫規則是,它們必須具有相同的路徑命令的編號和類型。因此,您需要修改「from」和「to」路徑中的一個或兩個,以便它們具有完全相同的線條和曲線數量,並且在路徑命令中以相同的順序。