2010-10-07 22 views
9

Tôi đang cố gắng hiển thị động một số nội dung SVG. Nội dung này được lưu trữ dưới dạng chuỗi trong nguồn dữ liệu của tôi. Chuỗi ví dụ sẽ trông giống như sau:Tải SVG vào SVGWeb động với JQuery

<svg width="200" height="200" style="background-color:#D2B48C; margin-bottom:5px;" id="embeddedSVG"> 
<g id="myGroup" fill="blue" style="font-size:18px; text-anchor:middle; font-family: serif;"> 
<circle id="myCircle" cx="100" cy="75" r="50" stroke="firebrick" stroke-width="3" /> 
<text x="100" y="155">Hello World</text><text x="100" y="175">From Embedded SVG!</text> 
</g></svg> 

Để phù hợp với IE, tôi đang sử dụng SvgWeb. Vấn đề của tôi là, để hiển thị nội dung svg, tôi cần bọc nó trong một tổ hợp thẻ <script type="image/svg+xml"></script>. Thách thức của tôi là, svg đang được kéo trở lại không đồng bộ thông qua JQuery. Và, với kiến ​​thức của tôi, tôi không thể tự động viết một thẻ 'script' từ JavaScript.

Làm cách nào để lấy nội dung SVG được truy xuất bằng JQuery và tự động hiển thị nó?

+0

Tôi đã tự hỏi điều tương tự. .. hy vọng ai đó đã tìm ra điều này. – awesomo

+0

Nhân tiện, vấn đề không phải là tự động tạo ra thẻ '

0

Bạn có thể sử dụng jQuery SVG plugin Trang web chính thức bị ngừng hoạt động, nhưng hãy quay lại để xem instructions.

Phần liên quan bạn đang yêu cầu là câu trả lời trong phần này, tôi tin rằng ..

tải (url, cài đặt) wrapper này tải một tài liệu SVG bên ngoài. Lưu ý rằng trình duyệt có thể không cho phép bạn tải tài liệu từ các trang web khác với trang của trang gốc. Nếu không có gọi lại được cung cấp và phát sinh lỗi, thông báo lỗi được hiển thị trong vùng chứa SVG.

url (chuỗi) là vị trí của tài liệu SVG hoặc nội dung SVG thực tế nội tuyến.

cài đặt (boolean) thấy addTo bên dưới hoặc (chức năng) thấy onLoad bên dưới hoặc (object) cài đặt bổ sung cho tải với các thuộc tính dưới đây:

addTo (boolean, không bắt buộc) đúng với thêm vào những gì đã có hoặc false (mặc định) để xóa canvas thay đổi đầu tiênKích thước (boolean, tùy chọn) đúng để cho phép kích thước canvas thành thay đổi hoặc false (mặc định) thành giữ nguyên kích thước ban đầu trênLoad (chức năng, tùy chọn) gọi lại sau tài liệu đã được tải, chức năng này nhận đối tượng trình bao bọc SVG và thông báo lỗi tùy chọn làm thông số, và trong đó đây là bộ phận container SVG .

svg.load('images/rect01.svg', 
    {addTo: true, onLoad: loadDone}); 
svg.load('<svg ...>...</svg>', loadDone); 

cũng có, cho đá, đây là một số mã PHP tôi sử dụng để chèn như tập tin SVG lên trong một tuyên bố vòng lặp, mà worked nicely ..

if (ICON_FILE_EXT == "svg") { 
     print "\<script\>svg.load(\'".ICON_PATH."/directory.svg\', \{addTo\: true, onLoad\: loadDone\}\)\;\<\/script\>"; 
+0

Đó SVG Plugin dường như là không tương thích với SVGWeb, hoặc ít nhất khi nó hiển thị trong flash (đó là mục đích của svgweb) – commonpike

Các vấn đề liên quan