javascript - d3 的面积图不在 jsp 页面上呈现，但在 html 上工作正常-6ren

javascript - d3 的面积图不在 jsp 页面上呈现，但在 html 上工作正常

转载作者：行者123 更新时间：2023-11-29 15:44:06

25

4

我在 html 页面中成功渲染了 d3js 面积图，这是在 chrome 或 mozilla 中成功渲染的代码。文件的名称是 temp.html。这是代码

<!DOCTYPE html>
<html lang="en" class="no-js">

<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<title>js graphs and charts libraries</title>
<script 
src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://d3js.org/d3.v3.js"></script>

<body>
    <div id="dbar">

    </div>

<script type="text/javascript"> 
    var margin = {top:10, right: 20, bottom: 30,left: 40},
        width = 960 - margin.left - margin.right,
        height = 400 - margin.top - margin.bottom;
        var svg = d3.select ("#dbar").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+")");
 var parseDate = d3.time.format("%m-%Y").parse;

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

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

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

    var area = d3.svg.area().x(function(d) { return x(d.date); })
                .y0(height)
                .y1(function(d) { return y(d.count); });
d3.json("data/json.json", function(error, data) {
      data.StoreVisitGraphCount.list.forEach(function(d) {

        d.date = parseDate(d.date);

        d.count = +d.count;
      });
      //console.log(data.StoreVisitGraphCount.list);
    x.domain(d3.extent(data.StoreVisitGraphCount.list, function(d) {
return d.date; }));
    y.domain([0, d3.max(data.StoreVisitGraphCount.list, function(d) { 
return d.count; })]);
console.log(data.StoreVisitGraphCount.list);
  svg.append("path")
      .datum(data.StoreVisitGraphCount.list)
      .attr("class", "area")
      .attr("d", area);

  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("Price ($)");
    });
</script>

</body>
</html>

但是当我复制粘贴此代码以显示“temp.jsp”页面时，它不会呈现并且图表不会出现。我正在 tomcat 服务器上运行此页面。

需要建议

最佳答案

不是因为你保存为jsp或者html页面。您需要将 charset="UTF-8"添加到您的脚本声明中，因为 d3.js 使用 UTF 字符。

例如。

<script src="http://d3js.org/d3.v3.js" charset="UTF-8"></script>

关于javascript - d3 的面积图不在 jsp 页面上呈现，但在 html 上工作正常，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14500380/

25

4

0

文章推荐： javascript - 这个交互式功能浏览器的 javascript 库是什么？

文章推荐： javascript - 避免 `fetch()` 将模型属性标记为已更改

文章推荐： javascript - 从图像中检索 EXIF

jsp - 能否将没有 .jsp 扩展名的文件呈现为 JSP？
是否可以让标准 Java EE servlet 容器将文件解释并呈现为 JSP，即使该文件没有 .jsp 扩展名？假设我的 WAR 根目录中有一个名为 foo.xyz 的文件。该文件包含一些 jST
jsp - 适合初级 JSP 开发人员的良好 JSP 框架
关闭。这个问题不满足Stack Overflow guidelines .它目前不接受答案。想改善这个问题吗？更新问题，使其成为 on-topic对于堆栈溢出。 6年前关闭。 Improve thi
jsp - jsp taglib 与包含 jsp 页面的根本区别是什么？
我有几个通用元素(组件)，它们会生成一些 html。似乎我的选择是创建一个 taglib，或者只是将该逻辑放入一个 jsp 页面并包含 jsp。有什么不同？积极与消极？最佳答案 Taglibs 允
jsp - 从 JSP 页面调用另一个 JSP 页面
我是 Ejb-JSP 的新手，对它知之甚少。我已经创建了一个 JSP 页面，它调用 Controller Servlet，而 servlet 调用 EJB。结构就像 JSP -> Servlet ->
jsp - 如何制作使用其他 JSP 标记的自定义 JSP 标记？
我想编写一个自定义 JSP 标签，其输出包括其他 JSP 标签，这些标签本身也应该被动态评估。但显然我的一切TagSupport子类写入 pageContext.getOut()无需任何进一步评估，直
jsp - 在过滤器中执行和呈现 JSP
我有一个包含页面顶部内容的 JSP，我们称它为 header.jsp。出于性能原因，我想呈现此 JSP 并将其刷新给用户，然后再构建页面的其余部分。 (有关性能优势的解释，请参阅 here。) 我能想
jsp - 今天的日期 JSP
我发现自己在处理一些旧的 JSP，想做一些简单的事情，比如以 dd/mm/yyyy 格式显示今天的日期好像没那么简单，到目前为止，我已经导入了 java.util.* 我试过很多东西 String
jsp - JSP 标签的字符集
关于 JSP 标签字符集的简单问题。 mytag很简单。 tag文件位于 WEB-INF/tags .这个文件在 Eclipse 中的字符集是 UTF-8。出于某种原因，UTF-8 符号无法
jsp - JSP EL可以做直接属性访问吗
这让我很吃惊!我的 JSP 中有以下代码。在我重构 SlideShow 类并公开所有属性并删除 getter/setter 之前，这段代码一直有效。所以在我看来，EL 只适用于 getter 而不
jsp - JSP 多语言化自动化
现有的一组 JSP，用英文字段标签、javascript 错误/信息消息、图像“alt”消息等硬编码，需要多语言化。将这些 JSP 转换为使用标准 Java 多语言功能(资源包、语言环境等)的最佳方
jsp - JSP-Servlet应用程序的任何viewstate实现？
Closed. This question needs to be more focused。它当前不接受答案。想改善这个问题吗？更新问题，使其仅通过editing this post专注于一个问题
jsp - 是否可以从命令行执行 JSP？
我已经在 Tomcat 6.0 下部署了我们的 War 到 Linux 服务器。在那个 Linux 机器上，我们没有打开浏览器的权限。是否可以从命令行执行 JSP？最佳答案您可以使用其中 wge
jsp - JSP 和自动刷新属性的最佳缓冲区大小
有没有人建议为 JSP 设置最佳缓冲区大小？您可以使用以下页面指令在 JSP 中设置缓冲区大小我的问题如下我的理解是，您使用的缓冲区大小越小，客户端浏览器的性能就越好。我的假设正确吗？如
jsp - 我如何指定我希望我的 jsp-config 指令应用于我们的应用程序中提供的所有 JSP 页面？
我们正在使用 JBoss 7.1.3.Final 和 Java 6。我想将 UTF-8 页面编码应用于我们网站上提供的所有 JSP 页面，因此我将其添加到我们的 web.xml 文件中
jsp - 动态包含 JSP
学过jsp native，想包含动态文件。我想使用 include 调用动态页面这段代码如果我输入 dashboard.jsp?p=about 页面打开“pages/a
JSP 链接到另一个 JSP
在我的 JSP 页面中，我希望链接转发到另一个 JSP 页面。当用户在 home.jsp 上时，我希望他们转到 login.jsp 等。我遇到的问题是无法找到 JSP，除非我将页面放在项目文件夹中(在
jsp - 在grails中使用index.jsp
我正在尝试在新的grails应用程序中使用index.jsp切换index.gsp。我将默认的index.gsp重命名为not_index.gsp，并添加了index.jsp。现在，我收到以下错误。
jsp - 从服务器端代码在新的浏览器选项卡中打开 JSP
是否可以从服务器端 jsf 代码将资源打开到新的浏览器选项卡(如命令按钮的 target="_newtab")？以下代码在同一选项卡中打开资源: FacesContext.getCurrentIns
jsp - .jsp 中的 JSP 语法和 XML 语法有什么不同？
我想问一个关于 .jsp 的问题。使用 jsp 语法(例如 )和 XML 语法(例如 ... )有什么不同。使用其中一种语法是否有维护或某种 advs？谢谢。最佳答案原始的语法更加紧凑，但如
jsp - JSP 的文件命名约定
JSP 文件是否有行业标准命名约定？我遇到过来自不同来源的三种约定: 全部小写 (thisismyfile.jsp) 首字母小写的驼峰式大小写 (thisIsMyFile.jsp) 首字母大写的驼峰

首页

博学

6Ren·AI

商城

javascript - d3 的面积图不在 jsp 页面上呈现，但在 html 上工作正常