SVG ve HTML'yi bir sayfaya nasıl karıştırabilirim?

Ben bazı SVG işleme yapmak için jQuery.svg plugin kullanıyorum ve mükemmel çalışıyor ama ben de sunucu sayfanıza bazı SVG oluşturabilmek istiyorum ve ben bu işe alınamıyor. Firefox'un işleyebilmesi için, aşağıdakine benzer bir SVG'yi sayfaya nasıl ekleyebilirim? SVG ve HTML'yi bir sayfaya nasıl karıştırabilirim?

<!DOCTYPE HTML> 
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg" > 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    </head> 

    <body> 

    <div class="map editable" id="map_1"><svg height="600" version="1.1" width="600" xmlns="http://www.w3.org/2000/svg"><image height="600" href="/system/graphics/1/original/floor-plan-large.gif" width="500" x="0" y="0" /><circle cx="300" cy="580" fill="red" r="5" stroke-width="2" stroke="red" /><circle cx="300" cy="400" fill="red" r="5" stroke-width="2" stroke="red" /><circle cx="260" cy="400" fill="red" r="5" stroke-width="2" stroke="red" /><circle cx="260" cy="340" fill="red" r="5" stroke-width="2" stroke="red" /><circle cx="140" cy="340" fill="red" r="5" stroke-width="2" stroke="red" /><polyline fill="none" points="300,580 300,400 260,400 260,340 140,340" stroke-width="3" stroke="blue" /></svg></div> 

    <svg version="1.1" baseProfile="full" width="300px" height="200px" xmlns="http://www.w3.org/2000/svg"> 
     <circle cx="150px" cy="100px" r="50px" fill="#ff0000" stroke="#000000" stroke-width="5px"/> 
    </svg> 


    <svg:svg version="1.1" baseProfile="full" width="300px" height="200px"> 
     <svg:circle cx="150px" cy="100px" r="50px" fill="#ff0000" stroke="#000000" stroke-width="5px"/> 
    </svg:svg> 

    </body> 
</html>

orada SVG içerik sayfasına olduğunu ya da bir şekilde SVG ad tanımlamak söyleyerek bir meta etiketi gerekiyor mu?

kaynak

2010-03-11 John Duff

this link (Mozilla Geliştirici Merkezi'ndeki @ HTML girişinde SVG'yi) bakınız.

bir satır içi SVG Örnek can be seen here

kaynak

2010-03-11 21:40:09 ChristopheD

Bu bağlantılara bir göz atıyorum ve eksik olan xmlns referanslarını ekledim ve hala çalışmıyor. Soruyu, çalışmayan tam bir html sayfasıyla güncelledim, neyi özlüyorum? –

Web sunucunuz hangi üstbilgileri kullanıyor? (Maalesef sadece google önbelleğinde: http://74.125.77.132/search?q=cache:12YX1EBBv8cJ:wiki.svg.org/Inline_SVG+xhtml+svg+inline+headers&cd=1&hl=nl&ct=clnk&gl=be) bu sayfaya bakın – ChristopheD

Web sunucusunun bunu 'application/xhtml + xml' olarak sunduğundan emin olun. – ChristopheD

Sizin doktrin nedir? Örnekle aynı olduğundan emin olun, yani HTML 4.01 TRANSITIONAL değil, XHTML.

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE html 
      PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

kaynak

2010-03-11 22:08:30

İşte bir örnek building inline SVGs dynamically with JavaScript.

kaynak

2011-06-12 15:22:52

SVG ve HTML'yi bir sayfaya nasıl karıştırabilirim?

cevap

İlgili konular