Задать вопрос
  • Как вывести графики js из файла?

    @s-zhura Автор вопроса
    С горем пополам подключил. Пришлось прописывать полный путь, включая https.
    Теперь проблема другая не работают два графика одновременно. Подключал по отдельности два js файла, объединял скрипты в один файл, ни так ни так не работают два сразу, либо один, либо другой. Если объединяю скрипты в один файл, то почему то работает только нижний скрипт. Может кто поможет? Может нужно прописать какие-то условия, типа, если открывают одну страницу, то работает тот-то скрипт, если другую, то другой.
    Вот два скрипта из файла (они идентичные, разница лишь в цвете графиков и значениях.):

    window. onload = function () {
        var chart= new CanvasJS.Chart("chartContainer-2", {
    
          animationEnabled: true, 
          zoomEnabled:true,
          legend:{
            verticalAlign: "bottom",
            horizontalAlign: "center"
          },
          axisY:{
            includeZero: false,
            prefix: "$",
    		  gridColor: "#DDD",
    		  gridThickness: 1,
    		  gridDashType: "dot",
    		  tickThickness: 1,
    		  interval: 250,
            maximum: 1900
          },
    		 axisX:{      
                valueFormatString: "DD-MM-YY",
    			   gridColor: "#DDD",
    			   gridDashType: "dot",
    			   tickThickness: 1,
    			   gridThickness: 1
          },
    		toolTip: {
            borderColor: "#61B057",
    		  backgroundColor: "#fbfbfb",
    		  borderThickness: 2,
    		  cornerRadius: 3,
    		  fontStyle: "normal",
    		  fontFamily: "tahoma"
          },
    		data: [
          {
            type: "spline",
            markerSize: 8,
    		  markerColor: "#61B057",
    		  markerBorderColor: "#FFF",
            markerBorderThickness: 1,
    		  lineColor: "#61B057",
            toolTipContent: "{x} <strong>${y} <strong>",
            dataPoints: [
            { x: new Date(2017,06,01), y: 215.00 },
            { x: new Date(2017,06,02), y: 109.00 },
            { x: new Date(2017,06,03), y: 326.00 },
            { x: new Date(2017,06,04), y: 724.00 },
    		  { x: new Date(2017,06,05), y: 624.00 },
    		  { x: new Date(2017,06,06), y: 571.00 },
            { x: new Date(2017,06,07), y: 601.00 },
            { x: new Date(2017,06,08), y: 364.00 },
            { x: new Date(2017,06,09), y: 514.00 },
            { x: new Date(2017,06,10), y: 765.00 },
    		  { x: new Date(2017,06,11), y: 909.00 },
            { x: new Date(2017,06,12), y: 944.00 },
            { x: new Date(2017,06,13), y: 1186.00 },
            { x: new Date(2017,06,14), y: 1179.00 },
            { x: new Date(2017,06,18), y: 1182.00 },
    		  { x: new Date(2017,06,19), y: 989.00 },
            { x: new Date(2017,06,20), y: 1009.00 }
            ]
          }
          ]
        });
    chart.render();
    }  
    
    window. onload = function () {
        var chart= new CanvasJS.Chart("chartContainer", {
    
          animationEnabled: true, 
          zoomEnabled:true,
          legend:{
            verticalAlign: "bottom",
            horizontalAlign: "center"
          },
          axisY:{
            includeZero: false,
            prefix: "$",
    		  gridColor: "#DDD",
    		  gridThickness: 1,
    		  gridDashType: "dot",
    		  tickThickness: 1,
    		  interval: 250,
            maximum: 1900
          },
    		 axisX:{      
                valueFormatString: "DD-MM-YY",
    			   gridColor: "#DDD",
    			   gridDashType: "dot",
    			   tickThickness: 1,
    			   gridThickness: 1
          },
    		toolTip: {
            borderColor: "#337ba7",
    		  backgroundColor: "#fbfbfb",
    		  borderThickness: 2,
    		  cornerRadius: 3,
    		  fontStyle: "normal",
    		  fontFamily: "tahoma"
          },
    		data: [
          {
            type: "spline",
            markerSize: 8,
    		  markerColor: "#337ba7",
    		  markerBorderColor: "#FFF",
            markerBorderThickness: 1,
    		  lineColor: "#337ba7",
            toolTipContent: "{x} <strong>${y} <strong>",
            dataPoints: [
            { x: new Date(2017,06,01), y: 215.00 },
            { x: new Date(2017,06,02), y: 409.00 },
            { x: new Date(2017,06,03), y: 526.00 },
            { x: new Date(2017,06,04), y: 624.00 },
    		{ x: new Date(2017,06,05), y: 624.00 },
    		{ x: new Date(2017,06,06), y: 871.00 },
            { x: new Date(2017,06,07), y: 901.00 },
            { x: new Date(2017,06,08), y: 964.00 },
            { x: new Date(2017,06,09), y: 914.00 },
            { x: new Date(2017,06,10), y: 1065.00 },
    		{ x: new Date(2017,06,11), y: 1109.00 },
            { x: new Date(2017,06,12), y: 944.00 },
            { x: new Date(2017,06,13), y: 1186.00 },
            { x: new Date(2017,06,14), y: 1239.00 },
            { x: new Date(2017,06,18), y: 1382.00 },
    		{ x: new Date(2017,06,19), y: 1419.00 },
            { x: new Date(2017,06,20), y: 1419.00 }
            ]
          }
          ]
        });
    chart.render();
    }
    Ответ написан
    Комментировать