个人中心
gpt4 book ai didi

javascript - 为什么在网络浏览器中用作字符串时失败说 d3 未定义

转载 作者：行者123 更新时间：2023-12-03 06:15:46 25 4
gpt4 key购买 nike

我正在尝试从字符串启动 WPF Web 浏览器。我在 head 部分引用了一个 java 脚本文件，它指向我的驱动器上的一个文件。对我来说看起来不错，但仍然失败。有任何想法吗？

提供给网络浏览器的字符串:

<!DOCTYPE html>
<meta charset="utf - 8">
<head>
<script src="file:///C:/Users/ksobon/AppData/Roaming/Dynamo/Dynamo%20Revit/1.0/packages/extra/d3/d3.v3.min.js"></script>
<link rel="stylesheet" href="file:///C:/Users/ksobon/AppData/Roaming/Dynamo/Dynamo%20Revit/1.0/packages/extra/bootstrap/css/bootstrap.min.css">
<style>
body { 
font: 10px Arial;
}
.axis path {
fill: none;
stroke: grey;
shape-rendering: crispEdges;
}
.axis text {
font-family: Arial;
font-size: 10px;
}
.axis line {
fill: none;
stroke: grey;
stroke-width: 1;
shape-rendering: crispEdges;
}

</style>
</head>
<div class="row">
<div class="col-md-12" id="linelinechart1" align="center">
<script>
    function renderLineChart() {

        var data = [{"name":"24-Apr-07","value":93.24},{"name":"25-Apr-07","value":95.35},{"name":"26-Apr-07","value":98.84},{"name":"27-Apr-07","value":99.92},{"name":"30-Apr-07","value":99.8},{"name":"1-May-07","value":99.47},{"name":"2-May-07","value":100.39},{"name":"3-May-07","value":100.4},{"name":"4-May-07","value":100.81},{"name":"7-May-07","value":103.92},{"name":"8-May-07","value":105.06},{"name":"9-May-07","value":106.88},{"name":"10-May-07","value":107.34},{"name":"11-May-07","value":108.74},{"name":"14-May-07","value":109.36},{"name":"15-May-07","value":107.52},{"name":"16-May-07","value":107.34},{"name":"17-May-07","value":109.44},{"name":"18-May-07","value":110.02},{"name":"21-May-07","value":111.98},{"name":"22-May-07","value":113.54},{"name":"23-May-07","value":112.89},{"name":"24-May-07","value":110.69},{"name":"25-May-07","value":113.62},{"name":"29-May-07","value":114.35},{"name":"30-May-07","value":118.77},{"name":"31-May-07","value":121.19},{"name":"1-Jun-07","value":118.4},{"name":"4-Jun-07","value":121.33}];

        var tickValues = data.map(function (d){return d.name;});
        var step = Math.floor(tickValues.length / 5);
        var indexes = d3.range(0,tickValues.length, step);
        if (indexes.indexOf(tickValues.length - 1) == -1){
            indexes.push(tickValues.length - 1);
        }
        var tickArray = d3.permute(tickValues, indexes);

        var margin = { top: 20, right: 20, bottom: 30, left: 50 },
            width = 547 - margin.left - margin.right,
            height = 400 - margin.top - margin.bottom;

        var x = d3.scale.ordinal()
            .domain(data.map(function (d) { return d.name; }))
            .rangePoints([0, width], 2);

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

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

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

        var line = d3.svg.line()
            .x(function (d) { return x(d.name); })
            .y(function (d) { return y(d.value); });

        var svg = d3.select("#linelinechart1").append("svg")
            .attr("width", width + margin.left + margin.right)
            .attr("height", height + margin.top + margin.bottom)
            .append("g")
            .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

        data.forEach(function (d) {
            d.name = d.name;
            d.value = +d.value;});

            y.domain([0, 200]);

        svg.append("g")
            .attr("class", "x axis")
            .attr("transform", "translate(0," + height + ")")
            .call(xAxis);

        svg.append("g")
            .attr("class", "y axis")
            .call(yAxis)
          .append("text")
            .attr("transform", "rotate(-90)")
            .attr("y", 6)
            .attr("dy", ".71em")
            .style("text-anchor", "end")
            .text("Label");

        svg.append("path")
            .datum(data)
            .attr("d", line)
            .attr("stroke", "#FA0000")
            .attr("stroke-width", 2)
            .attr("fill", "none");
    }

    renderLineChart();
</script>
</div>
</div>

以前，对 d3.min.js 的引用放置在 <script> 之后tag 和 renderLineChart() 函数调用之前，它工作得很好。

最佳答案

看来答案就在字符串格式中，其中文件路径名中的空格被 %20 替换，并使该路径不可读。我使用 Uri.UnescapeDataString() 来清理它，效果很好。谢谢!

关于javascript - 为什么在网络浏览器中用作字符串时失败说 d3 未定义，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39113111/

25 4 0
文章推荐： javascript - 倒数计时器达到 0 后添加 "0"
文章推荐： postgresql - 在 postgresql 中安装 python 扩展时出错
文章推荐： c# - Azure 存储容器(通用 v2)告诉我无法从代码中标记 blob
文章推荐： Javascript 日期问题返回比设置日期-时区少 1 天
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com