score:2
for people reading this now, reactjs has full svg support as of version 15.
so the <textpath>
element should now work as expected.
for details read the react v15.0 release notes.
score:1
textpath
is currently not supported so you'd have to resort to using dangerouslysetinnerhtml
.
let textpath = `<textpath xlink:href="#bigarc">come on in...</textpath>`;
<text dangerouslysetinnerhtml={{__html: textpath }}></text>;
score:1
so the problem is react not having full svg support, which is something still being worked on.
maybe something like this would help: https://github.com/facebook/react/issues/1657#issuecomment-70786561
i havent worked with react but thats what i could gather. hope it helps.
Source: stackoverflow.com
Related Query
- Why is SVG textPath not working in Firefox when rendered by React
- Curved Text in React (SVG textPath not working)
- React Native Text color not working
- React Native svg clip path on image not working
- React OnMouseDown event is not working whereas OnMouseUp is working fine.(on SVG elements)
- Importing SVG as React component not working with Next.js
- Can't type in react Input Text Field - onChange not working properly
- javascript bookmark script for filling text boxes not working for React page?
- Polygon mask SVG image not working for tsparticles in React
- React Accessible SVG Chart: aria-activedescendant not working
- React : Text and ternary combination not working
- react router navigation image with text link not working properly
- onKeyDown event not working on divs in React
- React colspan not working
- React router private routes / redirect not working
- proxy not working for react and node
- lodash debounce in React functional component not working
- React Router v4 routes not working
- React Router v4 Redirect not working
- onclick function is not working in react native application
- onClick not working React js
- React npm start not working : 'No version of chokidar available'
- Scroll View inside view not working react native
- React app not working in Internet Explorer 11
- Lodash debounce not working in React
- React create app hot reload is not always working on linux
- React native textDecoration properties not working on Android
- Using 'ref' on React Styled Components is not working
- Create React App not working
- Create react app, reload not working
More Query from same tag
- Link with dynamic variable
- How to defined correct data type for object
- How can i make all elements dissapear when one element is shown in react js?
- I can see data in console but CANNOT grab it. parent to child callback in React
- WebStorm highlights React component when props passed through react-redux connect function
- How to make 3-state button in React?
- How to check if a page exist in a custom server using Next.js
- Post controller recognizes only parameters sent by "from-data" or "x-www-form-urlencoded" from postman
- How can i add data in Realtime and display in my React app
- React Context vs Javascript window
- Combine all css files into one via webpack config-override
- How to create a protected route?
- Hide entire block of text whenever it no longer fits
- React async await not working with function component
- TypeError: props.handleToggle is not a function
- how to pass the data from data.json file in react components with the help of props in react js?
- @types/styled-components Duplicate identifier FormData
- Material-UI - Support babel-plugin-react-css-modules and rtl app
- Typescript/Javascript custom hooks
- Component not rerendering on a redux store change
- Infinite Loop from Promise and useState Hook
- TypeError: Cannot read property of undefined while using spotify's api
- Can I add multiple variables for the state in React Typescript without changing the interface?
- Did not expect server HTML to contain a <ins> in <ins> - AdSense ad within react hybrid
- How to remove selected value when click button of Autocomplete Material UI?
- React Redux Cannot read property 'dispatch' of undefined
- How does ReactJS prop binding work?
- how to use webpack externals for config data in react/redux app
- How to deselect option on selecting option of another select in react
- React goes back to initial state after POST ajax call