3回答
我正在使用飞碟(将CSS/HTML转成iText，再转成PDF)创建一个PDF，并尝试使用CSS3将图像页眉和页脚应用到每个页面。
我基本上想把这个div放在每个页面的左上角：
<div id="pageHeader">
<img src="..." width="250" height="25"/>
</div>
我的CSS看起来有点像这样：
@page {
size: 8.5in 11in;
margin: 0.5in;
@top-left {
浏览 5提问于2012-03-16得票数 49
回答已采纳
1回答
我正在使用svg.js像画布一样在上面绘制线条。是否可以将通过调用SVG()创建的svg元素缩放到父元素的大小？到目前为止，我只是在元素调整大小时重新绘制所有的线条。
<div
ref={r => this.whiteboard = r}
id="whiteboard"
>
</div>
{...}
let { offsetWidth: width, offsetHeight: height } = this.whiteboard;
this.draw = SVG('whiteboard').size(width, he
浏览 1提问于2018-03-20得票数 0
1回答
单击时更改图像(svg)
、、、、
我正在尝试Raphael + vectron，并且我正试图通过单击按钮来更改svg图像。
这(当然)是不可能的，因为当呈现svg时，它被呈现为路径：
<path cx="100" d="M35.269,257.154C34.393,245.68099999999998,45.438,234.091,48.492,223.00799999999998C53.634,204.34099999999998,54.985,185.004,60.041 and so on...... " stroke="none" fill="#9d49ce
浏览 0提问于2013-05-18得票数 4
回答已采纳
1回答
当使用D3.js单击外部SVG文件时，我试图旋转它。我注意到SVG只允许在<g>、<circle>和<rect>等标记上旋转。我想不出办法来完成这个任务。
HTML：
<div id="canvasdiv" style="border: 1px solid black; width:800px; height: 600px"></div>
Javascript：
// CREATE SVG DRAWING CANVAS
var paper = d3.select("#canvasdiv"
浏览 2提问于2013-12-09得票数 1
回答已采纳
1回答
我试图添加一个D3.js液体填充计()在传单弹出，但没有成功。
这是我的代码：
var map = L.map('map').setView([47.261491,-1.549244], 16);
var dataCenterIcon = L.icon({
iconUrl: 'images/datacenter-icon.png',
iconSize: [20, 20] // siz
浏览 4提问于2015-10-21得票数 1
回答已采纳
根据循环中的内容，我试图加载保存在单独文件中的SVG。当页面加载时，我看到以下内容：
嘿，这是我的密码：
<div
v-for="(rec, index) in stats"
:key="index"
>
<div class="iconForeground align-self-center" v-html="require(`../../../assets/svg/dashboard/attributes/${rec.icon}.svg`)">
</div>
浏览 2提问于2020-03-23得票数 1
回答已采纳
2回答
我正在尝试使用JS在页面上添加数百个小的“正方形”/shapes。但是，无论是使用SVG还是div，页面加载都非常慢。有没有一种更有效的方法在一个页面上创建多个形状而又不降低页面加载速度？
下面是中的一个示例，其中包含svg和div示例
这是JS：
var num = 700
for (i=0; i < num; i++){
let el = '<div class="els"></div>';
let elSVG = '<svg class="els"></svg>
浏览 1提问于2021-01-06得票数 2
回答已采纳
1回答
例如，在Internet上，他们可以很容易地调用svg文件中的对象。但我联系不到他们。这是我的html代码
<html lang="en">
<head>
<title>SVG Example</title>
<script src="mysvg.js"></script>
</head>
<body>
<div>
<button style="width: 100px; height: 50px" o
浏览 13提问于2022-06-10得票数 0
1回答
我正在使用svgwrite和python从位图中生成SVG中的图像，其中每一行都由θ围绕共同的原点旋转成扇形图案。目前，该图像在128行中运行约10 MB，这很大程度上是因为在79000+线段中保留了过多的浮点(每个像素一个线段)。
，我想通过画一条从原点到终点的单条线来显着地降低图像的大小，然后将一行‘图像’延伸到SVG线上。这是否有可能使用SVG?，除此之外，我愿意接受任何可能显着降低尺寸的建议，所以我以后可以将线条动画化。
浏览 3提问于2017-03-29得票数 0
回答已采纳
1回答
display:block.的前提：有8个选项卡(带有JS)通过显示来切换相关的内容包装:none->这些内容包装器中有动画SVG，它们会引发问题。本质上，如果选项卡是活动的，则相关的内容包装应该显示，SVG动画应该播放。一旦激活了另一个选项卡，前面的内容包装器和SVG动画应该重新设置。
我在SVGator中创建了一些动画，但由于以下几个原因未能使它们正常工作：
有8个选项卡，每个选项卡只包含8个SVGs中的一个，这意味着只有活动选项卡才会有动画。显然不是这样，他们都会动起来，即使是看不见的。所以我认为使用‘滚动到视图’可以修复它，再加上切换选项卡。但是，由于选项卡将SVG各自的包装从d
浏览 7提问于2022-02-05得票数 0
1回答
按钮在固定位置分区内变得无响应
、、、、
我在#zoom-controls上使用了position fixed，这样当我滚动的时候，button就会停留在屏幕的顶部。在我将position: fixed添加到div之前，按钮是有效的，但是如果我添加了position: fixed，button将变得没有响应。 在使用fiddlejs之后，我发现如果删除svg，即使div是固定的，按钮也可以正常工作。我需要svg留下。 下面是svg和position: fixed的代码--所以它不能工作： var butt = document.getElementById('zoom_in');
butt.addEventLi
浏览 13提问于2020-09-08得票数 1
回答已采纳
我正在尝试将SVG文件加载到svg.js中。我的问题是，svg.js生成了svg标签，当我导入我的svg时，它最终得到了2个SVG标签，这导致了冲突。 main.js import Vue from 'vue'
import { SVG } from '@svgdotjs/svg.js';
Vue.prototype.$SVG = SVG; 模板 <div>
<button @click="importSVG">import</button>
<div ref="drawin
浏览 141提问于2020-02-02得票数 0
2回答
D3-天文库导出到SVG
、、、
我正在使用D3-Celestial ()并尝试将画布图像转换为SVG (我需要将其用作矢量图像，以便可以将其转换为用于激光切割器的GCode )。我尝试使用Fabric JS库和Canvas-GetSVG，但没有成功。
有没有人有一个好的起点或者简单的方法呢？
<div style="overflow:hidden;"><div id="celestial-map"></div></div>
<div id="celestial-form"></div>
<scri
浏览 2提问于2017-12-02得票数 0
1回答
在将SVG转换为PDF时难以保留样式。我使用的是来自cloudFormatter.com的cssToPdf。 但是我需要使用样式mix-blend-mode: multiply；但是当我创建pdf时它不会被保留。 我也尝试过在svg元素上使用内联样式，方法也是将样式放入head和使用外部style.css文件。但在每一种情况下，我都得不到“多重效应”。 如何让pdf生成程序识别SVG元素的样式？ <!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta
浏览 26提问于2019-02-10得票数 1
回答已采纳
3回答
下面的动画应用于我的简单SVG：
@keyframes rotate {
100% {
-webkit-transform: rotateZ(360deg);
-ms-transform: rotateZ(360deg);
-o-transform: rotateZ(360deg);
transform: rotateZ(360deg);
}
}
.keepRotatingOne {
-webkit-animation-name: rotate;
-o-animation-name: rot
浏览 6提问于2016-03-15得票数 2
我有一个SVG，我正在尝试点击eventListener，它向下滚动并更改SVG的数据(就像动画)。问题是SVG的.contentDocument返回null，而我不能将它绑定到单击。我不太明白为什么，因为我在等待SVG加载，所以在我看来，它应该是工作的。下面是代码：
document.addEventListener("DOMContentLoaded", function(event) {
var video = document.querySelector("video");
var mySVG = document.querySele
浏览 3提问于2019-03-13得票数 2
回答已采纳
2回答
我正在尝试使用Javascript在引导网格中添加SVG控件。我可以使用Javascript添加SVG，但是页面的缩放/调整不像它是用静态HTML构建的。
当单击“added”按钮时，一组新的SVG控件将被添加到Bootstrap Grid中。SVG控件没有缩放。行不展开。
如果我使用静态HTML构建相同的页面，SVG控件将按预期进行缩放。我做错了什么？为什么在运行时使用Javascript添加的SVG控件不按预期进行缩放？
谢谢你的帮助!
工作示例(静态HTML)
不工作(Javascript)
<head>
<meta charset="u
浏览 6提问于2017-07-24得票数 0
回答已采纳
1回答
手写体不显示
、、、
我在stackoverflow中搜索，但我仍然找不到答案，尽管有人问过类似的问题。
我正在尝试显示由Kartoraph.py的demo生成的SVG地图。但是无论我做什么，它都不会显示出来。
下面是我的代码：
<!DOCTYPE html>
<html lang="en=us">
<head>
<title>Kartograph Demo</title>
<script src="/js/jquery-1.10.2.min.js"></scrip
浏览 2提问于2015-02-23得票数 0
作为标题，我正在学习React，我决定第一次在我的应用程序中使用useContext函数。当我尝试获取useContext值时，无论如何它都会返回未定义的值。我在主文件中尝试了许多与.Provider的组合，没有什么改变。
App.js
import React, { useState } from 'react'
import './index.css'
import Data from './data.json'
import Comment from './Comment'
function App() {
cons
浏览 4提问于2022-06-12得票数 0
回答已采纳
1回答
我正在尝试为typescript类中定义的函数设置单元测试用例。这个类依赖于svg.js。现在，当我尝试使用jest对函数进行单元测试时，它抛出错误SVG.extend或SVG不是函数。 我们已经尝试了在jest.config.js文件中将testEnvironment作为jsdom的节点的方法。 ts代码如下:从‘svg.js’导入SVG； export class DrawManager {
private static _drawingStage : SVG.Nested|undefined;
private static _canvas : SVG.Doc|undefined
浏览 70提问于2019-01-04得票数 1
1回答
所有人！我正在建立一个简单的反应一页的应用程序。这是职责清单。此列表中的圆圈是用svg创建的。
不幸的是，React.js代码无法工作。它给了我一个空白页面。
下面是我的代码：
<!DOCTYPE html>
<html>
<head>
<meta charset = "utf-8">
<link rel = "stylesheet" type = "text/css" href = "bootstrap/dist/css/bootstrap.
浏览 1提问于2017-04-26得票数 0
我的目标是从我自己的服务器上获取一个SVG，并在children <polygon></polygon> 标记之后插入属性。
我这样做是为了增加一个互动层，可以修改的反应。
到目前为止，我能够实现这一点，通过反应应用服务我的SVG，但我想避免它的安全原因。
到目前为止，这是我的进步：
const App = ({children}) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height
浏览 1提问于2022-05-20得票数 1
回答已采纳
1回答
我有一个使用生成的.svg文件。这些是SVG文件的结构：
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.d
浏览 1提问于2012-10-02得票数 0
回答已采纳
1回答
我想要动态导入svg，我无法在我的超文本标记语言页面中显示svg我使用Angular js:我有这样的代码: Directive.js：
angular.module ('SvgMapApp') directive ('svgMap', ['$ compile', function ($ compile) {
return {
restrict: 'A',
templateUrl: 'Scripts/widget.svg',
link: functio
浏览 0提问于2017-12-26得票数 0
1回答
当我在Object标记下有一个SVG时，对象标记下的任何东西我都不能显示，在本例中，类.card_middle和它的内容不会显示：
我在Github：中有SVG的完整文件
我需要使用它作为对象标记，因为我在SVG文件中运行了动画。
.card_top {
position: fixed;
top: 20%;
left: 50%;
transform: translate(-50%, -50%);
}
.card_middle {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%,
浏览 2提问于2018-12-23得票数 0
回答已采纳
1回答
但是，当使用viewBox调整大小时，我的结果并不是最优的。svg似乎是在div顶部的一个图层，我正试图将它放在其中。目标是在这些自举板中有几个量规，但我还没有通过第一个.
Plnkr：
不确定我的d3 js是否不正确，或者引导不正确，或者两者的组合。
var svg = d3.select( "#g1" )
.append( "svg" )
.classed("svg-container", true)
//responsive SVG needs these 2 attributes and no width and height
浏览 2提问于2016-12-20得票数 2
回答已采纳
1回答
我正在尝试使用NEXT.js导入svg文件。
遵循所有的指令，可以很好地工作。
// .babelrc
{
"presets": ["next/babel"],
"plugins": [
["styled-components", { "ssr": true }],
"inline-react-svg"
]
}
// image.tsx
import styled from 'styled-components';
import BackgroundIm
浏览 4提问于2021-08-01得票数 1
1回答
在我的rspec测试中，我试图选择一个带有JS: true的单选按钮。我不知道如何找到元素并选择它。这是我的测试。
within(".plan-picker__plan--best") do
find("plan_id_3").click
end
现在它说它找不到那个元素。
这是我的HTML
<li class="plan-picker__plan plan-picker__plan--best">
<div class="plan-picker__plan__header">
浏览 2提问于2016-11-07得票数 0
回答已采纳
目前我正在使用angular构建一个原型应用程序，我有一个要显示的人的列表，因此我为这个人构建了一个模型。当从http加载people 's list时，模型会被渲染。
<li class="person" ng-repeat="person in people" >
<h1>{{person.displayname}}</h1>
<div class="knockout">
<div id="person-{{person.displaynam
浏览 2提问于2014-02-06得票数 0
当内联<svg>元素包装在一个绝对定位的父元素中时，我遇到了一个问题，即内联viewBox元素没有扩展到它的本机大小，就像它的viewBox属性中声明的那样：
使用width: 100%似乎只会迫使SVG扩展到浏览器定义的默认300px大小。这还会导致<img>不调整到其本机维度的大小。
使用width: auto会使SVG通过0px完全折叠为0px的维度，但<img>现在的大小为其本机维度。
有趣的是，这种行为可以通过使用SVG作为data:image/svg+xml对<img>元素的src属性进行复制，因此似乎SVG不会将其本
浏览 2提问于2017-10-18得票数 8
回答已采纳
3回答
我有2个SVG路径，我想当用户滚动他们的父母时，他们会改变填充颜色。只有当用户在svg上悬停时，我才能让悬停起作用。我知道使用JS很容易，但我更喜欢坚持使用CSS。
<div class="button">
<svg width="100px" height="100px">
<circle cx="30" cy="30" r="20" style="stroke: black;"/>
</svg>
</
浏览 4提问于2013-11-08得票数 2
1回答
修改拉斐尔的现有路径？
、、、、
我有一个JS对象，Raphael用来生成一个可点击的SVG映射。我需要修改一些路径。我是否可以用用户友好的方式来使用这个工具呢？我不想摆弄数字使用反复试验技术，我想拖放路径/锚点。我可以以某种方式将坐标导入Illustrator/Dreamweaver/任何其他工具吗？
谢谢。
以下是JS对象的样子：
map.coords = [
{ type:"path" ,id:"K15" ,d:"/*edited out*/"},
{ type:"rect" ,id:"K14" ,x:"496" ,y:&
浏览 6提问于2012-10-22得票数 0
回答已采纳
当SVG包含具有自定义字体的文本时，我有一个问题与渲染SVG在构造in。
如何使SVG在Fabricjs中用自定义字体显示正确？
这是我的代码：
var canvasObject = document.getElementById("editorCanvas");
// set canvas equal size with div
$(canvasObject).width($("#canvasContainer").width());
$(canvasObject).height($("#canvasContainer"
浏览 1提问于2019-06-18得票数 2
回答已采纳
1回答
我有一个用d3渲染的SVG映射，并插入了一个函数来缩放这个函数。但是当我这样做的时候，地图就会覆盖页面的其他元素。基本上，我想把地图保存在它的div容器中(在下面的例子中，有类“col 10”)。
我的HTML代码
<div class="col-sm-10">
<div id="map">
</div>
</div>
D3JS
var svg = d3.select("#map")
.append("svg")
.attr("preserveAspectRatio&#
浏览 0提问于2018-02-17得票数 0
回答已采纳
3回答
当我单击svg中的一个对象时，我试图在特定的div中加载一个新的本地html页面。这是我的密码。
<html>
<head>
<script>
$("#button").click(function(){
$("#div1").load("1.html");
});
</script>
<svg width="100%" height="95%">
<a xlink:href="#" id="bu
浏览 3提问于2015-02-18得票数 0
回答已采纳
2回答
我正在尝试使用d3.js实现平移和缩放功能，一切正常，但当用户尝试在初始状态平移时，图像闪烁得很糟糕。
问题的再现
let imgHeight = 400, imgWidth = 900,
width = 900, height = 450;
let zoom = d3.zoom().scaleExtent([1, 8]).on("zoom", zoomed);
let svg = d3.select("#canvas").append("svg")
.attr("width", width +
浏览 20提问于2018-01-19得票数 3
回答已采纳
我正在尝试将html转换为bmp，在网上检查后，似乎没有直接的转换方法！因此，我尝试使用canvas JS将html转换为png，然后使用php将文件从PNG转换为BMP。我有问题保存图像文件到本地主机文件夹在画布JS，你能帮助吗？另一方面，如果你有更好的方法将html转换成bmp。请让我知道!非常感谢！
参考链接:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="
浏览 32提问于2019-10-26得票数 2
1回答
我有一些带有类js-season-list-item的div，它们都具有style="display: none;"或style="display: block;"的内联样式。它们被包装在series-seasons-list-wrap的父类中。我需要能够循环遍历父类，并找到当前设置为js-season-list-item的内联样式的style="display: block;"。如果是的话，我需要能够检查data-episode-count值，如果它小于6，我需要它将show-more类的显示设置为none。本质上，当用户在不同的季节视图之间切
浏览 2提问于2018-03-22得票数 0
1回答
我正在尝试创建一个基于SVG的菜单。我对SVG完全陌生，我已经花了1.5天的时间寻找JS和SVG之间交互的简单示例。我的文档结构是：
/LOCAL_FOLDER (not on a server yet)
+index.html
/CSS
+global.css
/JS
+navigation.js
/IMAGES
+navigation.svg
我有一个简单的html主体。
<body>
<div id="outer-container">
<div id=
浏览 2提问于2013-07-20得票数 0
1回答
我看过几十个类似的话题，但似乎没有一个管用！我的眼睛在出血！
这有点独一无二。我正在使用Morris.js创建折线图。它输出一个SVG，然后输出一堆circle元素。我所要做的就是将我自己的工具提示附加到圆圈中(我不想使用他们的)。但是工具提示不会追加，也不会在前面插入，也不会预先添加。我之所以阅读，是因为SVG在DOM中不被识别为HTML。我已经装好jquery.svg.js了。
js
$(document).ready(function(){
$('#firstTooltip').appendTo('<circle />');
});
h
浏览 2提问于2014-04-02得票数 0
2回答
我能够在父组件App.js中导入svg (在src文件夹中)，但不能导入子组件Home.js(src/Home.js/Home.js)。
当我直接导入父组件时，svg显示得很完美，但是如果导入子组件，它会说
模块未找到:无法解决。/img/BulbOn.svg‘中的’E：\网站工作\当前Work\parsa_ventures\src\components‘
import './App.css'
import Home from './components/Home'
function App() {
return (
浏览 0提问于2019-06-10得票数 3
回答已采纳
我使用svg.js和svg.pan-zoom.js使svg可以使用滚动缩放。就像svg.pan-zoom.js的演示()
这是我的代码，只是为了测试。
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="jquery.js"></script>
<script src="svg.js">&l
浏览 2提问于2016-08-25得票数 0
回答已采纳
标题在这个问题上可能是错误的。我在问但这是我的问题。不确定这是否可能：
我有两个反应元件，比如说
import logo from './logo.svg';
import './App.css';
import Test from './components/Test.js'
function App() {
return (
<div className="App">
<header className="App-header">
<Tes
浏览 3提问于2021-10-24得票数 1
回答已采纳
1回答
我正在尝试使我的SVG对不同的Windows更具响应性，但我在适用于我的文档中看不到太多。如何使我的设计更具响应性？ 这是我的HTML的结构： <body>
<div id="toggle"></div>
<div id="zoomArea">
<button type="button" class="btn btn-secondary" id="reset">Reset</button>
</d
浏览 12提问于2019-01-04得票数 1
2回答
我正在尝试使用像Two.js或SVG.js这样的SVG库，并动态地更改它们的动态生成的SVG元素，以便使它们具有响应性。这里有一个基本的示例，展示了预定义的内联SVG如何响应。
它涉及到将SVG元素包装在容器中、分配一些CSS值、添加viewBox和preserveAspectRatio属性。这似乎是做响应式SVG元素的常用方法：
<div class='container'>
<div class='svg-container'>
<svg version="1.1" viewBox=&#
浏览 1提问于2014-05-17得票数 0
我正在为我在d3.js datavizualisation中使用的数据的每个数据点绘制几个元素。这将根据数据创建一个简单的项列表。它的产出如下：
<div>
<p>[Title of datapoint 1]</p>
<svg>[SVG using datapoint 1]</svg>
</div>
<div>
<p>[Title of datapoint 2]</p>
<svg>[SVG using datapoint 2]</svg>
<
浏览 2提问于2020-01-18得票数 1
回答已采纳
2回答
我正在使用jQuery SVG插件生成SVG对象。问题是如何将其转换为脚本中的图像。
我的剧本如下：
<html>
<head>
<script type="text/javascript" src="jquery-latest.min.js"></script>
<script type="text/javascript" src="jquery.svg.js"></script>
<script typ
浏览 0提问于2011-01-28得票数 2
回答已采纳
我正在做一个预加载器，并且我正在与行作斗争。我想让我的灰色矩形填充3行33%的高度。
然后我需要：
在行1，svg 在行2，装载器在行3，一些文本
这是我想要的：
下面是我的代码：
#loader-modal {
width: 100vw;
height: 100vh;
position: fixed;
background-color: rgba(0,0,0, 0.9);
z-index: 100000;
}
.rectangle-chargement {
width: 25%;
height: 50%;
top
浏览 30提问于2019-05-28得票数 0
回答已采纳
我有一个web组件，如下所示：
文件: download-bar.js (web组件)
class DownloadBar extends HTMLElement {
constructor() {
super();
this.shadowDOM = this.attachShadow({mode: 'open'});
}
connectedCallback() {
this.render();
}
render() {
this.shadowDOM.i
浏览 2提问于2020-08-01得票数 0
4回答
我的目标是使"down-arrow.svg“更改为"up-arrow.svg”，如果单击包含此图像的上部div时图像为"down-arrow.svg“，反之亦然。
我已经查找了过去的问题和答案，发现了一些东西，但他们不能解决我的问题，这些index.html和index.js文件是从这里写的答案中产生的。我做错了什么？提前谢谢你。
index.html：
<head>
<title> Some Title </title>
<script src="index.js"></script
浏览 0提问于2017-10-01得票数 2
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
