mrTyler
@mrTyler
Frontend Developer

Почему при append('linearGradient') возвращается lineargradient (без camelCase)?

Коллективный разум needed.
Код участка генерации svg
window.d3 = d3.select(window.document);
			var margin = {top: 40, right: 40, bottom: 50, left: 40},
				width = 700 - margin.left - margin.right,
				height = 400 - margin.top - margin.bottom;

			var x = d3.scale.ordinal()
								.rangeRoundBands([ 0, width ], .4);

			var y = d3.scale.linear()
								.range([ height, 0 ], .1);

			var xAxis = d3.svg.axis()
										.scale(x)
										.orient("bottom");

			var yAxis = d3.svg.axis()
										.scale(y)
										.orient("left");

			var svg = window.d3.select("body").append("svg")
									.attr('xmlns', 'http://www.w3.org/2000/svg')
									.attr("width", width + margin.left + margin.right)
									.attr("height", height + margin.top + margin.bottom)
									.append("g")
									.attr("transform", "translate(" + margin.left + "," + margin.top + ")");


			x.domain(userData.data.map(function (d) { return d.day; }));
			y.domain([ 0, d3.max(userData.data, function (d) { return d.problems; }) ]);

			let gradient = svg.append('defs').append('defs:linearGradient')
				.attr('id', 'background')
				.attr('x1', '0%')
				.attr('y1', '0%')
				.attr('x2', '100%')
				.attr('y2', '0%');

			gradient
				.append('stop')
				.attr('style', 'stop-color: rgb(33,189,188); stop-opacity: 1')
				.attr('offset', '0%');
			gradient
				.append('stop')
				.attr('style', 'stop-color: rgb(94,221,187); stop-opacity: 1')
				.attr('offset', '100%');

			svg.append("g")
				.attr("style", "fill: #ffd862; color: #333")
				.attr("class", "x axis")
				.attr("transform", "translate(0," + height + ")")
				.attr('x', -20)
				.attr('y', -5)
				.call(xAxis);


на выходе имеем
<defs>
<lineargradient id="background" x1="0%" y1="0%" x2="100%" y2="0%">
  <stop style="stop-color: rgb(33,189,188); stop-opacity: 1" offset="0%"></stop>
  <stop style="stop-color: rgb(94,221,187); stop-opacity: 1" offset="100%"></stop>
</lineargradient>
</defs>


В процесе генерации svg изображения теряется camelCase.
  • Вопрос задан
  • 138 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы