คำถามติดแท็ก svg

นี่คือประเภท mime SVG ปกติ: image/svg+xml และมันใช้งานได้ดี อย่างไรก็ตามเมื่อฝังแบบอักษร SVG โครเมี่ยมจะบอกคุณว่าประเภท mime นั้นไม่ถูกต้องเพราะคุณส่งคืนแบบอักษรแทนภาพ มีประเภท mime สากลหรือไม่? ผิดหรือเปล่า? เป็นที่application/svg+xmlยอมรับอย่างใด ฉันเดาว่านี่ยังคงเป็นพื้นที่สีเทาใน HTML5 แต่บางคนที่นี่อาจรู้จัก

168 html  svg  font-face  mime-types 

เป็นไปได้ไหมที่จะตั้งค่าองค์ประกอบbackground-imageSVG<path> ตัวอย่างเช่นถ้าฉันตั้งองค์ประกอบclass="wall"สไตล์ CSS จะใช้.wall {fill: red;}งานได้ แต่.wall{background-image: url(wall.jpg)}จะไม่เป็นเช่น.wall {background-color: red;}นั้น

166 html  css  image  svg  background-image 

ใครรู้วิธีนี้สามารถทำได้? คุณจะใช้วัตถุผ้าใบ svg, jQuery ฯลฯ ได้หรือไม่

165 ipad  html  canvas  svg 

ฉันพบไลบรารี่มากมายเพื่อใช้ svg ใน Android และหลีกเลี่ยงการสร้างความละเอียดที่แตกต่างและการวางไฟล์สำหรับแต่ละความละเอียดซึ่งน่ารำคาญมากเมื่อแอพนี้มีไอคอนหรือรูปภาพจำนวนมาก ใคร ๆ ก็สามารถให้ขั้นตอนการใช้ไลบรารีที่ง่ายที่สุดสำหรับการใช้ SVG ใน Android ได้ฉันมั่นใจว่านี่จะช่วยคนอื่น ๆ ได้เช่นกัน นอกจากนี้ฉันยังใช้ Android Studio และ Illustrator เพื่อสร้างไอคอนและรูปภาพของฉัน

165 android  svg  androidsvg 

ดังนั้นฉันมีไฟล์ SVG ใน HTML และหนึ่งในสิ่งที่ฉันได้ยินเกี่ยวกับรูปแบบคือมันไม่ได้รับพิกเซลทั้งหมดเมื่อคุณซูมเข้า ฉันรู้ด้วย jpeg หรืออะไรก็ตามที่ฉันสามารถเก็บไว้เป็นไอคอน 50 x 50 แล้วจริง ๆ แล้วแสดงเป็นภาพขนาดย่อ (เป็นพิกเซล) 100 100 ภาพ (หรือ 10 10) โดยการตั้งค่าความสูงและความกว้างใน image_src ด้วยตนเอง แท็ก อย่างไรก็ตามไฟล์ SVG ดูเหมือนจะใช้กับแท็ก object / embed และการเปลี่ยนความสูงหรือความกว้างของ THOSE จะส่งผลให้มีการจัดสรรพื้นที่เพิ่มเติมสำหรับรูปภาพ มีวิธีใดที่จะระบุว่าคุณต้องการให้ภาพ SVG แสดงเล็กลงหรือใหญ่กว่าที่จัดเก็บจริงในระบบไฟล์หรือไม่?

157 html  svg 

ฉันดิ้นรนกับสิ่งนี้มาระยะหนึ่งแล้วดูเหมือนจะไม่สามารถหาคำตอบได้ ฉันมีไฟล์ SVG ซึ่งมีลักษณะเช่นนี้: <svg xmlns:dc="http://purl.org/dc/elements/1.1/" ... width="72.9375" height="58.21875" ...> ... <g ... transform="translate(10.75,-308.96875)" style="..."> <path inkscape:connector-curvature="0" d="m -10.254587,345.43597 c 0,-1.41732 0.17692,-2.85384 0.5312502,-3.5625 0.70866,-1.41733 2.14518,-2.82259 3.5625,-3.53125 1.41733,-0.70866 2.11392,-0.70867 3.53125,0 1.41732,0.70866 ... z" ... /> </g> </svg> ฉันต้องการลบtransform="..."เส้น แต่ยังมีภาพอยู่ที่ซึ่งฉันวางไว้ (ใน InkScape) หากฉันลบการแปลงด้วยตนเองรูปภาพจะซิปไปยังส่วนอื่นของหน้าจอ (ตามที่คาดไว้) แต่ฉันต้องกำจัดการแปลงทั้งหมดและในเวลาเดียวกันให้ภาพอยู่ตรงที่ฉันต้องการ มีวิธีลบ / แปลงให้แบนเป็นเส้นทางที่พิกัดตัวเอง? (การเปลี่ยนแปลงเพียงอย่างเดียวที่ฉันต้องจัดการคือการแปลและปรับขนาดไม่มีเมทริกซ์)

155 svg  transform  inkscape 

ฉันใช้แวดวง svg ในโครงการของฉันเช่นนี้ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 120"> <g> <g id="one"> <circle fill="green" cx="100" cy="105" r="20" /> </g> <g id="two"> <circle fill="orange" cx="100" cy="95" r="20" /> </g> </g> </svg> และฉันใช้ดัชนี z ในgแท็กเพื่อแสดงองค์ประกอบแรก ในโครงการของฉันฉันต้องใช้เฉพาะค่าดัชนี z แต่ฉันไม่สามารถใช้ดัชนี z กับองค์ประกอบ svg ของฉันได้ ฉันเที่ยวมาก แต่ก็ไม่ค่อยเจออะไรเลย ดังนั้นโปรดช่วยฉันใช้ z-index ใน svg ของฉัน นี่คือDEMO

154 javascript  jquery  svg  z-index 

คำถามสั้น ๆ : การใช้เส้นทาง SVG เราสามารถวาด 99.99% ของวงกลมและปรากฏขึ้น แต่เมื่อเป็น 99.99999999% ของวงกลมแล้ววงกลมจะไม่ปรากฏขึ้น จะแก้ไขอย่างไร? เส้นทาง SVG ต่อไปนี้สามารถวาดวงกลมได้ 99.99%: (ลองดูที่http://jsfiddle.net/DFhUF/1381/และดูว่าคุณเห็น 4 arcs หรือ 2 arcs เพียง 2 แต่โปรดทราบว่าถ้าเป็น IE มันจะเป็น แสดงผลใน VML ไม่ใช่ SVG แต่มีปัญหาที่คล้ายกัน) M 100 100 a 50 50 0 1 0 0.00001 0 แต่เมื่อมันเป็น 99.99999999% ของวงกลมแล้วไม่มีอะไรจะแสดงเลย? M 100 100 a …

147 svg  geometry  drawing  vml  geometric-arc 

ภาพ SVG เป็นภาพเวกเตอร์ล้วนๆหรือเราสามารถรวมภาพบิตแมปเป็นภาพ SVG ได้หรือไม่? วิธีการเกี่ยวกับการแปลงที่นำไปใช้กับภาพบิตแมป (เปอร์สเปคทีฟแมป ฯลฯ ) แก้ไข : รูปภาพอาจรวมอยู่ใน SVG โดยอ้างอิงลิงก์ ดูhttp://www.w3.org/TR/SVG/struct.html#ImageElement คำถามของฉันเป็นจริงหากภาพบิตแมปอาจรวมอยู่ใน svg เพื่อให้ภาพ svg จะมีอยู่ในตัวเอง มิฉะนั้นเมื่อใดก็ตามที่ภาพ svg ปรากฏขึ้นจะต้องมีการเชื่อมโยงและภาพที่ดาวน์โหลด Apparently .svg files เป็นเพียงไฟล์ xml

147 image  svg  bitmapimage 

ฉันมีวัตถุ SVG ในหน้า HTML ของฉันและฉันห่อมันในสมอดังนั้นเมื่อมีการคลิกที่ภาพ svg ผู้ใช้จะไปที่ลิงค์ของสมอ <a href="http://www.google.com/"> <object data="mysvg.svg" type="image/svg+xml"> <span>Your browser doesn't support SVG images</span> </object> </a> เมื่อฉันใช้บล็อกรหัสนี้การคลิกวัตถุ svg ไม่ได้พาฉันไปที่ google ใน IE8 <ข้อความขยายสามารถคลิกได้ ฉันไม่ต้องการแก้ไขภาพ svg ของฉันให้มีแท็ก คำถามของฉันคือฉันจะทำให้ภาพ svg คลิกได้อย่างไร

143 html  object  svg  anchor 

สมมติว่าฉันมีไฟล์ SVG: <svg width="1024" height="768" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <text x='20' y='60' style="font-size: 60px">b</text> <text x='100' y='60' style="font-size: 60px">a</text> </svg> ฉันต้องการจัดตำแหน่งด้านบนของaและbอย่างใด ที่จริงแล้วฉันต้องการให้ตำแหน่งของฉันเป็นไปตามrooflineแทนที่จะเป็นbaseline!

142 svg  vertical-alignment  w3c 

ในtypescript(*.tsx)ไฟล์ฉันไม่สามารถนำเข้าไฟล์ svg ด้วยคำสั่งนี้: import logo from './logo.svg'; Transpiler พูดว่า:[ts] cannot find module './logo.svg'. ไฟล์ svg ของฉันเป็นไฟล์<svg>...</svg>. แต่ใน .jsไฟล์ฉันสามารถนำเข้าได้โดยไม่มีปัญหาใด ๆ กับคำสั่งนำเข้าที่เหมือนกันทุกประการ ฉันคิดว่ามันมีส่วนเกี่ยวข้องกับประเภทของไฟล์ svg ซึ่งต้องตั้งค่าไว้สำหรับ ts Transpiler คุณช่วยแบ่งปันวิธีทำให้งานนี้เป็นไฟล์ ts ได้ไหม

139 typescript  svg 

ฉันชอบแบบอักษรไอคอนตัวอักษรที่ยอดเยี่ยมและต้องการใช้สำหรับไอคอนส่วนใหญ่ในเว็บไซต์ของฉัน แต่มีไอคอน svg ที่กำหนดเองไม่กี่ตัวที่ฉันต้องการนอกเหนือไปจากสิ่งที่มีให้ ฉันสังเกตว่าFont. รุ่น SVVGนั้นประกอบไปด้วย<glyph />องค์ประกอบเหล่านี้เป็นส่วนใหญ่: ... <glyph unicode="" horiz-adv-x="1536" d="M0 80v477q0 51 24.5 61.5t59.5 -24.5l162 -162l340 338l-338 338l-164 -164q-35 -35 -59.5 -25.5t-24.5 60.5v477q0 31 23 57q27 23 57 23h477q51 0 61.5 -24.5t-24.5 -59.5l-160 -158l338 -338l332 334l-162 162q-35 35 -24.5 59.5t61.5 24.5h477q33 0 55 -23 q25 -25 25 …

138 svg  webfonts  font-awesome 

ฉันต้องการตั้งค่าสีพื้นหลังเริ่มต้นสำหรับเอกสาร SVG ทั้งหมดเป็นสีแดง <svg viewBox="0 0 500 600" style="background: red">/* content */</svg> วิธีแก้ปัญหาข้างต้นใช้งานได้ แต่คุณสมบัติพื้นหลังของแอตทริบิวต์ style นั้นไม่ใช่คุณสมบัติมาตรฐาน: http://www.w3.org/TR/SVG/styling.html#SVGStylingPropertiesดังนั้นจึงถูกลบออกในระหว่างกระบวนการทำความสะอาดด้วย SVG ทำความสะอาด มีวิธีอื่นในการประกาศสีพื้นหลังนี้หรือไม่?

134 svg 

มีวิธีเริ่มต้นในการวาดไฟล์ SVG ลงบนผืนผ้าใบ HTML5 หรือไม่ Google Chrome รองรับการโหลด SVG เป็นรูปภาพ (และใช้งานง่าย ๆdrawImage) แต่คอนโซลนักพัฒนาซอฟต์แวร์เตือนสิ่งresource interpreted as image but transferred with MIME type image/svg+xmlนั้น ฉันรู้ว่ามีความเป็นไปได้ที่จะแปลง SVG เป็นคำสั่ง canvas (เช่นในคำถามนี้ ) แต่ฉันหวังว่าจะไม่จำเป็น ฉันไม่สนใจเบราว์เซอร์รุ่นเก่า (ดังนั้นถ้า FireFox 4 และ IE 9 จะรองรับบางอย่างก็เพียงพอแล้ว)

131 html  canvas  svg